freemium-survey-components 2.0.462 → 2.0.463

package/lib/bundle.css

@@ -3977,39 +3977,38 @@ div.surveyserv-widget-container.compact-container-style .fsc-radio-group button.
   align-items: center;
   gap: 6px;
 }
-/* ===== FACEBOOK MESSENGER PREVIEW STYLES ===== */
-.fb-wrapper {
+/* ===== META MOBILE CONTAINER STYLES (Generic) ===== */
+.meta-wrapper {
   width: 100%;
   height: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
+  font-family: "Helvetica Neue", "Segoe UI", "Roboto", "Helvetica", "Arial", "sans-serif";
 }
 
-.facebook-wrapper {
+.facebook-wrapper,
+.instagram-wrapper,
+.whatsapp-wrapper {
   /* === WRAPPER & PHONE FRAME === */
   /* === SIDE BUTTONS === */
   /* === HEADER === */
-  /* === CHAT BODY === */
-  /* === QUESTION & MESSAGE STYLES === */
-  /* === ANSWER STYLES === */
-  /* === CHOICE BUTTONS === */
-  /* === QUICK REPLY BUTTONS === */
-  /* === INPUT BAR === */
-  /* === MODAL & POPUP STYLES === */
-  /* === PROMPT STYLES === */
-  /* === UTILITY STYLES === */
 }
-.facebook-wrapper * {
+.facebook-wrapper *,
+.instagram-wrapper *,
+.whatsapp-wrapper * {
   scrollbar-width: none;
-  text-align: center !important;
 }
-.facebook-wrapper .mobile {
+.facebook-wrapper .meta-mobile,
+.instagram-wrapper .meta-mobile,
+.whatsapp-wrapper .meta-mobile {
   position: relative;
   display: inline-block;
 }
-.facebook-wrapper .phone-frame {
+.facebook-wrapper .meta-phone-frame,
+.instagram-wrapper .meta-phone-frame,
+.whatsapp-wrapper .meta-phone-frame {
   position: relative;
   width: 310px;
   height: 574px;
@@ -4020,34 +4019,46 @@ div.surveyserv-widget-container.compact-container-style .fsc-radio-group button.
   flex-direction: column;
   overflow: hidden;
 }
-.facebook-wrapper .mobile-actions {
+.facebook-wrapper .meta-mobile-actions,
+.instagram-wrapper .meta-mobile-actions,
+.whatsapp-wrapper .meta-mobile-actions {
   position: absolute;
   left: -18px;
   top: 140px;
   right: -18px;
 }
-.facebook-wrapper .mobile-actions .side-buttons {
+.facebook-wrapper .meta-mobile-actions .meta-side-buttons,
+.instagram-wrapper .meta-mobile-actions .meta-side-buttons,
+.whatsapp-wrapper .meta-mobile-actions .meta-side-buttons {
   position: absolute;
   background: #e5e5e5;
 }
-.facebook-wrapper .mobile-actions .left-side-buttons-container {
+.facebook-wrapper .meta-mobile-actions .meta-left-side-buttons-container,
+.instagram-wrapper .meta-mobile-actions .meta-left-side-buttons-container,
+.whatsapp-wrapper .meta-mobile-actions .meta-left-side-buttons-container {
   position: absolute;
   left: 10px;
   top: 0;
 }
-.facebook-wrapper .mobile-actions .left-side-buttons-container .side-buttons.left {
+.facebook-wrapper .meta-mobile-actions .meta-left-side-buttons-container .meta-side-buttons.left,
+.instagram-wrapper .meta-mobile-actions .meta-left-side-buttons-container .meta-side-buttons.left,
+.whatsapp-wrapper .meta-mobile-actions .meta-left-side-buttons-container .meta-side-buttons.left {
   width: 8px;
   height: 55px;
   border-radius: 4px 0 0 4px;
   margin-bottom: 8px;
 }
-.facebook-wrapper .mobile-actions .left-side-buttons-container .side-buttons.left-2 {
+.facebook-wrapper .meta-mobile-actions .meta-left-side-buttons-container .meta-side-buttons.left-2,
+.instagram-wrapper .meta-mobile-actions .meta-left-side-buttons-container .meta-side-buttons.left-2,
+.whatsapp-wrapper .meta-mobile-actions .meta-left-side-buttons-container .meta-side-buttons.left-2 {
   width: 8px;
   height: 55px;
   border-radius: 4px 0 0 4px;
   margin-top: 64px;
 }
-.facebook-wrapper .mobile-actions .side-buttons.right {
+.facebook-wrapper .meta-mobile-actions .meta-side-buttons.right,
+.instagram-wrapper .meta-mobile-actions .meta-side-buttons.right,
+.whatsapp-wrapper .meta-mobile-actions .meta-side-buttons.right {
   position: absolute;
   right: 10px;
   top: 0;
@@ -4055,1269 +4066,1173 @@ div.surveyserv-widget-container.compact-container-style .fsc-radio-group button.
   height: 80px;
   border-radius: 0 4px 4px 0;
 }
-.facebook-wrapper .fb-header {
+.facebook-wrapper .meta-header,
+.instagram-wrapper .meta-header,
+.whatsapp-wrapper .meta-header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 12px 16px;
   border-bottom: 1px solid #ddd;
-  background: #fff;
+  background: linear-gradient(180deg, #f8f9fa 0%, #fff 100%);
 }
-.facebook-wrapper .fb-header .header-left {
+.facebook-wrapper .meta-header .meta-header-left,
+.instagram-wrapper .meta-header .meta-header-left,
+.whatsapp-wrapper .meta-header .meta-header-left {
   display: flex;
   align-items: center;
   gap: 8px;
 }
-.facebook-wrapper .fb-header .fb-header-brand {
+.facebook-wrapper .meta-header .meta-header-brand,
+.instagram-wrapper .meta-header .meta-header-brand,
+.whatsapp-wrapper .meta-header .meta-header-brand {
   display: flex;
   align-items: center;
   gap: 6px;
 }
-.facebook-wrapper .fb-header .fb-header-brand .logo {
-  width: 28px;
-  height: 28px;
+.facebook-wrapper .meta-header .meta-header-brand .meta-logo,
+.instagram-wrapper .meta-header .meta-header-brand .meta-logo,
+.whatsapp-wrapper .meta-header .meta-header-brand .meta-logo {
+  width: 32px;
+  height: 32px;
   border-radius: 50%;
-  background: #20a849;
   color: #fff;
   display: flex;
   justify-content: center;
   align-items: center;
   font-weight: bold;
-  font-size: 14px;
+  font-size: 16px;
+  flex-shrink: 0;
 }
-.facebook-wrapper .fb-header .fb-header-brand .title {
+.facebook-wrapper .meta-header .meta-header-brand .meta-title,
+.instagram-wrapper .meta-header .meta-header-brand .meta-title,
+.whatsapp-wrapper .meta-header .meta-header-brand .meta-title {
   font-weight: 600;
-  font-size: 14px;
-  color: #000;
+  font-size: 15px;
 }
-.facebook-wrapper .fb-header .icon-blue {
-  color: #0084ff;
-  font-size: 18px;
-  cursor: pointer;
+.facebook-wrapper .meta-header .meta-header-brand svg,
+.instagram-wrapper .meta-header .meta-header-brand svg,
+.whatsapp-wrapper .meta-header .meta-header-brand svg {
+  width: 16px;
+  height: 16px;
+  flex-shrink: 0;
 }
-.facebook-wrapper .chat-body {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
+
+/* Platform-specific header styles */
+.facebook-wrapper .meta-header {
   background: #fff;
-  padding: 12px;
-  overflow-y: auto;
 }
-.facebook-wrapper .chat-body .msg-container {
-  display: flex;
-  flex-direction: column;
-  flex-grow: 1;
-  overflow: hidden;
+.facebook-wrapper .meta-header .meta-logo {
+  background: #0584fe;
 }
-.facebook-wrapper .chat-body .msg-container .scroll-wrapper {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-  overflow-y: auto;
-  padding-bottom: 10px;
+
+.instagram-wrapper .meta-header {
+  background: #fff;
 }
-.facebook-wrapper .question-container {
-  align-self: flex-start;
-  max-width: 240px;
-  min-width: 150px;
+.instagram-wrapper .meta-header .meta-header-right {
   display: flex;
-  flex-direction: column;
-  gap: 8px;
-  pointer-events: none;
-  background-color: #f0f0f0;
-  border-radius: 2px 16px 16px 16px;
+  align-items: center;
+  gap: 14px;
 }
-.facebook-wrapper .question-container .question-text {
-  font-size: 14px;
-  line-height: 1.4;
-  padding: 10px 14px;
-  background-color: transparent;
-  border-radius: 18px;
-  word-break: break-word;
-  color: #000;
-  text-align: left !important;
+.instagram-wrapper .meta-header .meta-header-right svg {
+  height: 18px;
+  margin-top: 4px;
 }
-.facebook-wrapper .question-container .question-text.required::after {
-  content: "*";
-  color: #e74c3c;
-  margin-left: 4px;
+.instagram-wrapper .meta-header .meta-header-right svg:first-child {
+  width: 22px;
+  height: 20px;
 }
-.facebook-wrapper .question-container .question-text p {
-  margin: 0;
-  text-align: left;
+.instagram-wrapper .meta-header .meta-header-right svg:first-child path {
+  fill: #262626;
+  stroke-width: 0;
 }
-.facebook-wrapper .question-container .question-text a {
-  color: #0084ff;
-  -webkit-text-decoration: underline;
-  text-decoration: underline;
+.instagram-wrapper .meta-header .meta-header-right svg path {
+  fill: none;
+  stroke: #262626;
+  stroke-width: 1.5;
 }
-.facebook-wrapper .question-container .question-text .placeholder-tag > span {
-  display: none !important;
+.instagram-wrapper .meta-header .meta-header-right svg {
+  height: 18px;
+  margin-top: 4px;
 }
-.facebook-wrapper .question-container.active {
-  pointer-events: initial;
+.instagram-wrapper .meta-header .meta-header-right svg path {
+  fill: none;
+  stroke: #262626;
+  stroke-width: 1.5;
 }
-.facebook-wrapper .question-container.active .choices-button {
-  color: #000;
-  padding-left: 25px;
-  padding-right: 25px;
-  padding: 8px 12px;
-  margin: 10px;
-  border-radius: 8px;
-  font-weight: bold;
-  background-color: #fbfbfb;
+.instagram-wrapper .meta-header .meta-logo {
+  background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
 }
-.facebook-wrapper .question-container.active .choices-button button {
-  color: #000;
+
+.whatsapp-wrapper .meta-header {
+  background: #fff;
 }
-.facebook-wrapper .question-container.active .choices-button svg:not(#star) {
-  fill: #000;
+.whatsapp-wrapper .meta-header .meta-logo {
+  background: #20a849;
 }
-.facebook-wrapper .question-container.active.open-modal {
-  margin-bottom: 45px;
+.whatsapp-container, .instagram-container {
+  --wa-message-margin: 40px;
+  --wa-message-border: 6px;
+  --wa-message-bg: #fff;
+  --wa-message-color: #0096de;
+  --wa-message-disabled-color: #aaa;
+  --wa-answers-bg: #d3ffc8;
+  --wa-answers-color: #000;
+  --wa-answers-radius: 6px;
+  --wa-message-width: calc(100% - var(--wa-message-margin) - 2px);
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  font-size: var(--fsc-font-size);
+  position: relative;
+  width: 310px;
+  height: 574px;
+  margin: 0 auto;
+  font-family: var(--fsc-default-font-family);
+  color: var(--default-question-text-color);
 }
-.facebook-wrapper .question-container#new {
-  margin-bottom: 10px;
+.whatsapp-container svg, .instagram-container svg {
+  display: inline !important;
 }
-.facebook-wrapper .answers-container {
-  align-self: flex-end;
-  display: flex;
-  justify-content: flex-end;
-  margin-top: 8px;
+.whatsapp-container.instagram, .instagram.instagram-container {
+  --wa-message-bg: none;
+  --wa-answers-bg: #4d5bff;
+  --wa-answers-color: #fff;
+  --wa-answers-radius: 21px;
+  width: 310px;
+  height: 574px;
 }
-.facebook-wrapper .answers-container .answers {
-  background: #0084ff;
-  color: #fff;
-  padding: 8px 14px;
-  border-radius: 18px;
-  font-size: 14px;
-  max-width: 240px;
-  display: inline-block;
-  align-items: center;
-  white-space: normal;
-  overflow-wrap: break-word;
-  word-break: break-word;
-  hyphens: auto;
+.whatsapp-container.instagram svg, .instagram.instagram-container svg {
+  display: inline !important;
 }
-.facebook-wrapper .answers-container .answers .reply-block {
-  background: rgba(255, 255, 255, 0.1);
-  margin: -6px -6px 4px;
-  padding: 5px 8px;
-  border-radius: 6px;
-  border-left: 3px solid #fff;
+.whatsapp-container.instagram .msg-container, .instagram.instagram-container .msg-container {
+  position: relative;
+  background-image: none;
 }
-.facebook-wrapper .answers-container .answers .reply-block .user {
-  color: #fff;
-  font-weight: 600;
-  margin-bottom: 3px;
-  font-size: 12px;
+.whatsapp-container.instagram .choices, .instagram.instagram-container .choices {
+  display: none;
+  flex-direction: row;
+  position: absolute;
+  bottom: 0;
+  margin-right: 0;
+  width: 100%;
+  margin-left: -10px !important;
 }
-.facebook-wrapper .answers-container .answers .reply-block .question {
-  margin: 0;
-  font-size: 13px;
+.whatsapp-container.instagram .choices:before, .instagram.instagram-container .choices:before {
+  content: "";
+  display: block;
+  width: 100%;
+  position: absolute;
+  top: 0px;
+  border-top: 1px solid #e8e8e8;
+}
+.whatsapp-container.instagram .choices .choice, .instagram.instagram-container .choices .choice {
+  border: 1px solid #0584fe;
+  border-radius: 50px;
+  color: #0584fe;
+  box-shadow: none;
+}
+.whatsapp-container.instagram .choices .reply-button:first-child, .instagram.instagram-container .choices .reply-button:first-child,
+.whatsapp-container.instagram .choices .range-choice:first-child,
+.instagram.instagram-container .choices .range-choice:first-child,
+.whatsapp-container.instagram .choices .choice:first-child,
+.instagram.instagram-container .choices .choice:first-child {
+  margin-left: 10px !important;
 }
-.facebook-wrapper .answers-container .answers:empty {
+.whatsapp-container.instagram .choices.one-line .range-choice, .instagram.instagram-container .choices.one-line .range-choice,
+.whatsapp-container.instagram .choices.one-line .choice,
+.instagram.instagram-container .choices.one-line .choice {
+  flex-grow: 0;
+}
+.whatsapp-container.instagram .question-container, .instagram.instagram-container .question-container {
+  background: #efefef;
+  padding: 2px;
+  border-radius: 21px;
+}
+.whatsapp-container.instagram .question-container .options-popup, .instagram.instagram-container .question-container .options-popup {
+  display: flex;
+  overflow: auto;
+  flex-direction: row;
+  padding: 0px;
+  box-shadow: none;
+  border-top: 1px solid #e8e8e8;
+  border-radius: 0;
+  left: 7px;
+  min-height: 50px;
+  bottom: 0px;
+  width: calc(100% - 10px);
+}
+.whatsapp-container.instagram .question-container .options-popup footer, .instagram.instagram-container .question-container .options-popup footer,
+.whatsapp-container.instagram .question-container .options-popup header,
+.instagram.instagram-container .question-container .options-popup header {
   display: none;
 }
-.facebook-wrapper .answers-container .answers .answer-text {
+.whatsapp-container.instagram .question-container .options-popup main, .instagram.instagram-container .question-container .options-popup main {
   display: flex;
-  align-items: center;
-  gap: 4px;
+  padding: 6px;
+  gap: 6px;
+  height: -moz-fit-content;
+  height: fit-content;
 }
-.facebook-wrapper .answers-container .answers .answer-text span {
-  white-space: nowrap;
+.whatsapp-container.instagram .question-container .options-popup main .option-row, .instagram.instagram-container .question-container .options-popup main .option-row {
+  border: 1px solid #0584fe;
+  border-radius: 50px;
+  padding: 5px 10px;
 }
-.facebook-wrapper .answers-container .answers .answer-text .star-rating-wrapper {
+.whatsapp-container.instagram .question-container .options-popup main .option-row button, .instagram.instagram-container .question-container .options-popup main .option-row button {
+  color: var(--wa-message-color);
   display: flex;
-  align-items: center;
-  gap: 2px;
-  text-overflow: ellipsis;
-  overflow: hidden;
+  gap: 6px;
 }
-.facebook-wrapper .answers-container .answers .answer-text .star-rating-wrapper svg {
-  vertical-align: bottom;
+.whatsapp-container.instagram .question-container .choices-button.choice, .instagram.instagram-container .question-container .choices-button.choice {
+  font-weight: 700;
+  font-size: 1em;
+  line-height: 16px;
+  letter-spacing: -0.03em;
+  color: #333333;
+  border: none;
+  width: auto;
+  padding: 8px;
+  border-radius: 10px;
+  margin: 5px 10px 10px;
+  box-shadow: none;
 }
-.facebook-wrapper .answers-container .answers .answer-text .star-rating-wrapper span {
-  align-items: center;
-  overflow-wrap: break-word;
-  word-break: break-word;
-  hyphens: auto;
+.whatsapp-container.instagram .question-container .choices-button.choice svg, .instagram.instagram-container .question-container .choices-button.choice svg {
+  display: none;
 }
-.facebook-wrapper .answers-container .answers .answer-text .emoji-rating-wrapper {
-  display: flex;
-  align-items: center;
-  gap: 2px;
+.whatsapp-container.instagram .question-container .question-text-container, .instagram.instagram-container .question-container .question-text-container {
+  box-shadow: none;
 }
-.facebook-wrapper .answers-container .answers .answer-text .emoji-rating-wrapper svg {
-  vertical-align: bottom;
+.whatsapp-container.instagram .question-container.active, .instagram.instagram-container .question-container.active {
+  margin-bottom: 50px;
 }
-.facebook-wrapper .answers-container .answers .answer-text .emoji-rating-wrapper span {
-  align-items: center;
-  white-space: normal;
-  overflow-wrap: break-word;
-  word-break: break-word;
-  hyphens: auto;
+.whatsapp-container.instagram .question-container.active.input-active, .instagram.instagram-container .question-container.active.input-active {
+  margin-bottom: 0px;
 }
-.facebook-wrapper .choices {
+.whatsapp-container.instagram .question-container.active .choices, .instagram.instagram-container .question-container.active .choices {
   display: flex;
-  flex-direction: column;
   gap: 6px;
-  margin-top: 8px;
-  list-style-type: none;
-  padding: 0;
+  overflow: auto;
+  flex: 1;
+  background: #fff;
+  margin: 0;
+  padding-top: 8px;
 }
-.facebook-wrapper .choices.multi-choice .choice button {
-  white-space: normal;
+.whatsapp-container.instagram .question-container.active .choices .choice button, .instagram.instagram-container .question-container.active .choices .choice button {
+  white-space: nowrap;
 }
-.facebook-wrapper .choices.one-line {
-  flex-direction: column;
-  align-items: center;
+.whatsapp-container.instagram .question-container.active .choices.reply-buttons, .instagram.instagram-container .question-container.active .choices.reply-buttons {
+  display: flex;
+  flex-wrap: nowrap;
 }
-.facebook-wrapper .choices.one-line .range-choice,
-.facebook-wrapper .choices.one-line .choice {
-  width: 100%;
-  max-width: 200px;
+.whatsapp-container.instagram .question-container.active .choices.multi-choice, .instagram.instagram-container .question-container.active .choices.multi-choice {
+  padding: 0;
+  margin: 0;
 }
-.facebook-wrapper .choices.boolean-choices {
-  padding-left: 15px;
-  padding-right: 15px;
+.whatsapp-container.instagram .question-container.active .choices.multi-choice::before, .instagram.instagram-container .question-container.active .choices.multi-choice::before {
+  content: none;
 }
-.facebook-wrapper .choices.boolean-choices .boolean-choice {
-  font-weight: bold;
-  background-color: #fbfbfb !important;
+.whatsapp-container.instagram .textarea-container, .instagram.instagram-container .textarea-container {
+  background: #fff;
 }
-.facebook-wrapper .choices.boolean-choices .boolean-choice:hover {
-  background-color: #e4e6ea !important;
+.whatsapp-container.instagram .textarea-container textarea, .instagram.instagram-container .textarea-container textarea {
+  background: #e8e8e8;
+  border-radius: 18px;
 }
-.facebook-wrapper .choices.dropdown-choices {
-  padding: 0 12px;
-  gap: 8px;
+.whatsapp-container.instagram .textarea-container svg rect, .instagram.instagram-container .textarea-container svg rect {
+  fill: #4d5bff;
 }
-.facebook-wrapper .choices.dropdown-choices .dropdown-choice {
-  font-weight: 500;
-  background-color: #fbfbfb;
-  border: 1px solid transparent;
-  transition: all 0.2s ease;
+.whatsapp-container.instagram .answers, .instagram.instagram-container .answers {
+  box-shadow: none;
+  margin-inline-end: 6px;
+  padding-bottom: 6px;
+  padding-top: 6px;
+  width: -moz-fit-content;
+  width: fit-content;
 }
-.facebook-wrapper .choices .choice {
-  background-color: #f0f0f0;
-  padding: 8px 12px;
-  border-radius: 8px;
-  text-align: center;
-  color: #000;
+.whatsapp-container.whatsapp .choices .choice button, .whatsapp.instagram-container .choices .choice button {
+  min-height: 26px;
 }
-.facebook-wrapper .choices .choice button {
-  font-weight: bold;
-  width: 100%;
-  padding: 0;
-  border: none;
-  background: transparent;
-  color: #000;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  white-space: nowrap;
-  font-size: 14px;
+.whatsapp-container .ellipsis-wrapper, .instagram-container .ellipsis-wrapper {
+  text-overflow: ellipsis;
+  overflow: hidden;
 }
-.facebook-wrapper .choices .choice svg:not(#star) {
-  fill: #000;
+.whatsapp-container .ellipsis-wrapper svg, .instagram-container .ellipsis-wrapper svg {
+  vertical-align: middle;
 }
-.facebook-wrapper .choices .choice.range-choice {
-  padding-top: 4px;
-  padding-bottom: 4px;
+.whatsapp-container .star-rating-wrapper, .instagram-container .star-rating-wrapper {
+  text-overflow: ellipsis;
+  overflow: hidden;
 }
-.facebook-wrapper .choices .choices-button {
-  background-color: #fbfbfb;
-  padding: 8px 12px;
-  border-radius: 8px;
-  text-align: center;
-  color: #000;
-  border: none;
-  cursor: pointer;
-  font-weight: bold;
-  min-width: 120px;
-  max-width: 200px;
+.whatsapp-container .star-rating-wrapper svg, .instagram-container .star-rating-wrapper svg {
+  vertical-align: bottom;
 }
-.facebook-wrapper .quick-reply-area {
-  padding: 8px 12px 0;
-  background: #fff;
-  border-top: 1px solid #e4e6ea;
+.whatsapp-container .msg-container, .instagram-container .msg-container {
+  flex-grow: 1;
+  padding: 4px 8px;
+  overflow: hidden;
+  display: flex;
+  background-image: var(--fsc-whatsapp-chat-background);
+  background-repeat: no-repeat;
+  background-size: cover;
 }
-.facebook-wrapper .quick-reply-area .quick-reply-buttons {
+.whatsapp-container .scroll-wrapper, .instagram-container .scroll-wrapper {
   display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-  padding-bottom: 8px;
+  flex-direction: column;
+  align-items: baseline;
+  gap: 12px;
+  overflow: scroll;
 }
-.facebook-wrapper .quick-reply-area .quick-reply-buttons.scrollable {
-  flex-wrap: nowrap;
-  overflow-x: auto;
-  scrollbar-width: none; /* Firefox */
-  -ms-overflow-style: none; /* IE and Edge */
+.whatsapp-container .question-text.required::after, .instagram-container .question-text.required::after {
+  content: "*";
+  color: rgb(215, 45, 48);
+  margin-left: 4px;
 }
-.facebook-wrapper .quick-reply-area .quick-reply-buttons.scrollable::-webkit-scrollbar {
-  display: none; /* Chrome, Safari, Opera */
+.whatsapp-container .question-text, .instagram-container .question-text {
+  transition: font-size var(--fsc-transition-duration) ease-in-out;
+  font-size: var(--question-font-size);
+  line-height: 18px;
+  padding: 12px;
+  background-color: var(--wa-message-bg);
+  border-radius: var(--wa-message-border);
+  word-break: break-word;
 }
-.facebook-wrapper .quick-reply-area .quick-reply-buttons .quick-reply-button {
-  background: #fff;
-  border: 1px solid #1877f2;
-  color: #1877f2;
-  padding: 8px 16px;
-  border-radius: 20px;
-  font-size: 14px;
-  font-weight: 500;
-  cursor: pointer;
-  transition: all 0.2s ease;
-  white-space: nowrap;
-  flex-shrink: 0; /* Prevent shrinking in scrollable mode */
+.whatsapp-container .question-text p, .instagram-container .question-text p {
+  text-align: left;
 }
-.facebook-wrapper .quick-reply-area .quick-reply-buttons .quick-reply-button:hover {
-  background: #1877f2;
-  color: #fff;
+.whatsapp-container .question-text a, .instagram-container .question-text a {
+  color: var(--link-color);
+  -webkit-text-decoration: underline;
+  text-decoration: underline;
 }
-.facebook-wrapper .quick-reply-area .quick-reply-buttons .quick-reply-button:active {
-  transform: scale(0.98);
+.whatsapp-container .question-text .placeholder-tag > span, .instagram-container .question-text .placeholder-tag > span {
+  display: none !important;
 }
-.facebook-wrapper .quick-reply-area .quick-reply-buttons .quick-reply-button .star-rating-wrapper {
+.whatsapp-container .question-container, .instagram-container .question-container {
+  max-width: var(--wa-message-width);
+  margin-inline-end: var(--wa-message-margin);
+  gap: 2px;
   display: flex;
-  align-items: baseline;
-  gap: 8px;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-.facebook-wrapper .quick-reply-area .quick-reply-buttons .quick-reply-button .star-rating-wrapper svg {
-  vertical-align: bottom;
+  flex-direction: column;
+  pointer-events: none;
+  text-align: left;
 }
-.facebook-wrapper .input-bar {
-  display: flex;
-  align-items: center;
-  padding: 8px;
-  border-top: 1px solid #ddd;
-  gap: 10px;
-  background: #fff;
+.whatsapp-container .question-container .question-text-container, .instagram-container .question-container .question-text-container {
+  box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 1px;
 }
-.facebook-wrapper .input-bar .input-icons {
-  display: flex;
-  gap: 12px;
-  color: #0084ff;
-  font-size: 18px;
+.whatsapp-container .question-container.active, .instagram-container .question-container.active {
+  pointer-events: initial;
 }
-.facebook-wrapper .input-bar .input-icons svg {
-  width: 15px;
-  height: 20px;
+.whatsapp-container .question-container.active .choice, .instagram-container .question-container.active .choice {
+  color: var(--wa-message-color);
 }
-.facebook-wrapper .input-bar .input-container {
-  display: flex;
-  gap: 8px;
-  align-items: anchor-center;
+.whatsapp-container .question-container.active .choice button, .instagram-container .question-container.active .choice button {
+  color: var(--wa-message-color);
 }
-.facebook-wrapper .input-bar .input-container .input-field {
-  flex: 1;
-  display: flex;
-  align-items: center;
-  background: #f0f0f0;
-  border-radius: 20px;
-  padding: 6px 12px;
-  min-height: 32px;
+.whatsapp-container .question-container.active .choice svg:not(#star), .instagram-container .question-container.active .choice svg:not(#star) {
+  fill: var(--wa-message-color);
 }
-.facebook-wrapper .input-bar .input-container .input-field .text-input {
-  flex: 1;
-  border: none;
-  outline: none;
-  background: transparent;
-  font-size: 14px;
+.whatsapp-container .question-container.active.open-modal, .instagram-container .question-container.active.open-modal {
+  margin-bottom: 45px;
 }
-.facebook-wrapper .input-bar .input-container .input-field .text-input::placeholder {
-  color: #65676b;
+.whatsapp-container .question-container#new, .instagram-container .question-container#new {
+  margin-bottom: 10px;
 }
-.facebook-wrapper .input-bar .input-container .input-field .facebook-textarea-container {
-  display: flex;
-  gap: 8px;
-  height: 32px;
-  align-items: center;
+.whatsapp-container .answers-container, .instagram-container .answers-container {
   width: 100%;
+  display: flex;
+  justify-content: end;
+  text-align: left;
 }
-.facebook-wrapper .input-bar .input-container .input-field .facebook-textarea-container textarea {
-  scrollbar-width: none;
-  resize: none;
-  height: 20px !important;
-  background: transparent;
-  border: none;
-  border-radius: 20px;
-  padding: 6px 12px;
-  width: 100%;
+.whatsapp-container .answers, .instagram-container .answers {
+  background: var(--wa-answers-bg);
+  margin-left: var(--wa-message-margin);
+  border-radius: var(--wa-answers-radius);
+  color: var(--wa-answers-color);
+  padding: 12px;
+  width: -moz-fit-content;
+  width: fit-content;
+  font-size: 1.1429em;
+  box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 1px;
+  word-break: break-word;
+  padding-bottom: 6px;
+}
+.whatsapp-container .answers .reply-block, .instagram-container .answers .reply-block {
+  background: rgba(0, 0, 0, 0.08);
+  margin: -6px -6px 4px;
+  padding: 5px 8px;
+  border-radius: 6px;
+  border-left: 3px solid #2c5cc5;
+}
+.whatsapp-container .answers .reply-block p, .instagram-container .answers .reply-block p {
+  margin-top: 4px;
+  margin-bottom: 2px;
+  color: #4a5e57;
   font-size: 14px;
-  text-align: left !important;
 }
-.facebook-wrapper .input-bar .input-container .input-field .facebook-textarea-container textarea:focus {
-  outline: none;
+.whatsapp-container .answers .reply-block .user, .instagram-container .answers .reply-block .user {
+  color: #2c5cc5;
+  font-weight: 600;
+  margin-bottom: 3px;
 }
-.facebook-wrapper .input-bar .input-container .input-field .facebook-textarea-container textarea::placeholder {
-  color: #65676b;
-  line-height: 16px;
+.whatsapp-container .answers:empty, .instagram-container .answers:empty {
+  display: none;
 }
-.facebook-wrapper .input-bar .input-container .icon-container button {
-  width: 20px;
-  margin-right: 4px;
-  margin-top: 4px;
+.whatsapp-container .answers .answer-text, .instagram-container .answers .answer-text {
+  display: flex;
+  align-items: center;
 }
-.facebook-wrapper .input-bar .thumbs {
-  font-size: 20px;
-  color: #0084ff;
+.whatsapp-container .answers .answer-text span, .instagram-container .answers .answer-text span {
+  white-space: nowrap;
 }
-.facebook-wrapper .options-popup {
+.whatsapp-container .options-popup, .instagram-container .options-popup {
   position: absolute;
   z-index: 1;
   border-radius: 12px 12px 30px 30px;
   background-color: #fff;
-  box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.1);
+  box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.06);
   padding: 12px 8px;
+  bottom: 0;
+  left: 0;
+  right: 0;
   transform: translateY(80px);
   transition: all linear 0.3s;
-  width: 304px;
   opacity: 0;
-  right: 0px;
-  bottom: 6px;
 }
-.facebook-wrapper .options-popup header {
-  text-align: center;
-  display: flex;
-  align-items: baseline;
-  padding-bottom: 20px;
-  position: relative;
+.whatsapp-container .fade-enter-active, .instagram-container .fade-enter-active {
+  transform: translateY(0px);
+  opacity: 1;
 }
-.facebook-wrapper .options-popup header .close-btn {
-  background: transparent;
-  border: none;
-  width: 32px;
-  height: 32px;
-  position: absolute;
-  cursor: pointer;
+.whatsapp-container .fade-enter-done, .instagram-container .fade-enter-done {
+  transform: translateY(0px);
+  opacity: 1;
 }
-.facebook-wrapper .options-popup header .option-tab-bar {
-  width: 64px;
-  background-color: #cfd7df;
-  height: 3px;
-  border-radius: 10px;
-  margin: auto;
-  margin-bottom: 0px;
+.whatsapp-container .fade-exit-active, .instagram-container .fade-exit-active {
+  opacity: 0;
+  transform: translateY(80px);
 }
-.facebook-wrapper .options-popup header h4 {
-  margin: 0 auto;
-  font-weight: 500;
+.whatsapp-container .fade-exit-done, .instagram-container .fade-exit-done {
+  opacity: 0;
+  transform: translateY(80px);
 }
-.facebook-wrapper .options-popup main {
-  padding: 0 8px;
+.whatsapp-container .option-row, .instagram-container .option-row {
+  padding-bottom: 16px;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal {
-  padding: 0px 16px;
-  text-align: center;
+.whatsapp-container .option-row button, .instagram-container .option-row button {
+  display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+  width: 100%;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .modal-question-name {
-  text-align: center;
-  font-size: 18px;
-  font-weight: 600;
-  color: #1c1e21;
-  margin: 10px 0;
-  line-height: 1.3;
+.whatsapp-container .option-row button span, .instagram-container .option-row button span {
+  white-space: nowrap;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .rating-labels {
+.whatsapp-container header, .instagram-container header {
+  text-align: center;
   display: flex;
-  justify-content: space-between;
-  margin: 16px 0 8px;
-  font-size: 10px;
-  color: #65676b;
-  font-weight: 400;
+  align-items: center;
+  padding-bottom: 20px;
+  position: relative;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .star-container {
-  display: flex;
-  justify-content: center;
-  gap: 8px;
-  margin: 8px 0;
-  padding: 0 16px;
+.whatsapp-container main, .instagram-container main {
+  padding: 0 8px;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .star-container .star-button {
+.whatsapp-container .close-btn, .instagram-container .close-btn {
   background: transparent;
   border: none;
-  cursor: pointer;
-  padding: 4px;
-  transition: transform 0.2s ease;
-}
-.facebook-wrapper .options-popup main .facebook-rating-modal .star-container .star-button:hover {
-  transform: scale(1.1);
-}
-.facebook-wrapper .options-popup main .facebook-rating-modal .star-container .star-button svg {
   width: 32px;
   height: 32px;
+  position: absolute;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .emoji-button {
-  font-size: 32px;
-  transition: transform 0.1s ease, font-size 0.1s ease;
-  line-height: 1.5;
-}
-.facebook-wrapper .options-popup main .facebook-rating-modal .emoji-button.selected,
-.facebook-wrapper .options-popup main .facebook-rating-modal .emoji-button:hover {
-  transform: scale(1.2);
-}
-.facebook-wrapper .options-popup main .facebook-rating-modal .number-container {
+.whatsapp-container .choices-button, .instagram-container .choices-button {
   display: flex;
+  align-items: center;
   justify-content: center;
+  width: 100%;
   gap: 12px;
-  margin: 8px 0;
-  padding: 0 16px;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .number-container.single-row {
-  flex-direction: row;
-  flex-wrap: nowrap;
+.whatsapp-container.instagram .scroll-wrapper, .instagram.instagram-container .scroll-wrapper {
+  width: 100%;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .number-container.grid-layout {
+.whatsapp-container.instagram .choices.one-line, .instagram.instagram-container .choices.one-line {
   flex-direction: row;
-  flex-wrap: wrap;
-  max-width: 350px;
+  flex-wrap: nowrap;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .number-container.grid-layout .number-button:nth-child(odd) {
-  order: 1;
+.whatsapp-container.instagram .choices.one-line .choice, .instagram.instagram-container .choices.one-line .choice {
+  max-width: -moz-fit-content;
+  max-width: fit-content;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .number-container.grid-layout .number-button:nth-child(even) {
-  order: 2;
+.whatsapp-container.instagram .choices.reply-buttons, .instagram.instagram-container .choices.reply-buttons {
+  display: none;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .number-container .number-button {
-  background: #e4e6ea;
-  border: none;
-  cursor: pointer;
-  font-size: 14px;
-  font-weight: 600;
-  color: #000;
-  min-width: 30px;
-  min-height: 30px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: all 0.2s ease;
-  opacity: 1;
-  border-radius: 5px;
-  gap: 10px;
-  padding-top: 5px;
-  padding-right: 9px;
-  padding-bottom: 5px;
-  padding-left: 9px;
-}
-.facebook-wrapper .options-popup main .facebook-rating-modal .number-container .number-button:hover {
-  transform: scale(1.05);
-}
-.facebook-wrapper .options-popup main .facebook-rating-modal .number-container .number-button.selected {
-  background: #1877f2 !important;
-  color: #fff !important;
-}
-.facebook-wrapper .options-popup main .facebook-rating-modal .submit-button {
-  width: 100%;
-  background: #1877f2;
-  color: #fff;
-  border: none;
-  border-radius: 8px;
-  padding: 12px;
-  font-size: 16px;
-  font-weight: 600;
-  cursor: pointer;
-  transition: background-color 0.2s ease;
+.whatsapp-container.instagram .choices.reply-buttons .reply-button, .instagram.instagram-container .choices.reply-buttons .reply-button {
+  width: -moz-fit-content;
+  width: fit-content;
+  max-width: -moz-fit-content;
+  max-width: fit-content;
+  flex: unset;
+  padding: 4px 12px;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .submit-button:hover:not(:disabled) {
-  background: #166fe5;
+.whatsapp-container.instagram .choices.reply-buttons .reply-button:only-child, .instagram.instagram-container .choices.reply-buttons .reply-button:only-child {
+  flex: 0 0 auto;
+  width: -moz-fit-content;
+  width: fit-content;
 }
-.facebook-wrapper .options-popup main .facebook-rating-modal .submit-button:disabled {
-  background: #e4e6ea;
-  color: #bcc0c4;
-  cursor: not-allowed;
+.whatsapp-container .choices, .instagram-container .choices {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  list-style-type: none;
+  padding: 5px 0;
+  margin: 0;
 }
-.facebook-wrapper .options-popup main .option-row {
-  padding-bottom: 16px;
+.whatsapp-container .choices.multi-choice .choice button, .instagram-container .choices.multi-choice .choice button {
+  white-space: normal;
 }
-.facebook-wrapper .options-popup main .option-row button {
+.whatsapp-container .choices.reply-buttons, .instagram-container .choices.reply-buttons {
+  margin: 0;
   display: flex;
-  align-items: center;
-  flex-wrap: nowrap;
-  min-width: 120px;
-  max-width: 200px;
+  flex-direction: row;
+  flex-wrap: wrap;
 }
-.facebook-wrapper .options-popup main .option-row button span {
-  white-space: nowrap;
+.whatsapp-container .choices.reply-buttons .reply-button, .instagram-container .choices.reply-buttons .reply-button {
+  padding: 4px 12px;
+  flex: 1 1 100%;
+  max-width: 100%;
 }
-.facebook-wrapper .options-popup footer {
-  color: #65676b;
-  font-size: 12px;
-  text-align: center;
+.whatsapp-container .choices.reply-buttons .reply-button:only-child, .instagram-container .choices.reply-buttons .reply-button:only-child {
+  flex: 1 1 100%;
 }
-.facebook-wrapper .options-popup footer .privacy-text {
-  font-size: 11px;
-  color: #65676b;
-  text-align: center;
-  margin-top: 16px;
-  line-height: 1.4;
+.whatsapp-container .choices.one-line, .instagram-container .choices.one-line {
+  flex-direction: unset;
+  flex-wrap: wrap;
+  padding: 0;
+  margin: 2px 0;
 }
-.facebook-wrapper .options-popup footer .privacy-text span {
-  color: #1877f2;
-  cursor: pointer;
-  -webkit-text-decoration: none;
-  text-decoration: none;
+.whatsapp-container .choices.one-line .range-choice, .instagram-container .choices.one-line .range-choice,
+.whatsapp-container .choices.one-line .choice,
+.instagram-container .choices.one-line .choice {
+  width: -moz-fit-content;
+  width: fit-content;
+  max-width: var(--wa-message-width);
 }
-.facebook-wrapper .options-popup footer .privacy-text span:hover {
-  -webkit-text-decoration: underline;
-  text-decoration: underline;
+.whatsapp-container .choices--vertical.one-line .choice, .instagram-container .choices--vertical.one-line .choice {
+  width: 100%;
+  max-width: 100%;
 }
-.facebook-wrapper .options-popup.fade-enter-active, .facebook-wrapper .options-popup.fade-enter-done {
-  transform: translateY(0px);
-  opacity: 1;
+.whatsapp-container .choice, .instagram-container .choice {
+  background-color: var(--wa-message-bg);
+  padding: 8px 12px;
+  border-radius: var(--wa-message-border);
+  text-align: center;
+  color: var(--wa-message-disabled-color);
+  box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 1px;
 }
-.facebook-wrapper .options-popup.fade-exit-active, .facebook-wrapper .options-popup.fade-exit-done {
-  opacity: 0;
-  transform: translateY(80px);
+.whatsapp-container .choice button, .instagram-container .choice button {
+  color: var(--wa-message-disabled-color);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  white-space: nowrap;
 }
-.facebook-wrapper .prompt-container {
-  margin-bottom: 12px;
+.whatsapp-container .choice svg:not(#star), .instagram-container .choice svg:not(#star) {
+  fill: var(--wa-message-disabled-color);
 }
-.facebook-wrapper .prompt-container .question-container {
-  background-color: #f0f0f0;
-  border-radius: 2px 16px 16px 16px;
+.whatsapp-container .range-choice, .instagram-container .range-choice {
+  padding-top: 4px;
+  padding-bottom: 4px;
 }
-.facebook-wrapper .prompt-container .question-container .choices {
-  padding-left: 25px;
-  padding-right: 25px;
-  font-weight: bold;
+.whatsapp-container h4, .instagram-container h4 {
+  margin: 0 auto;
+  font-weight: 500;
 }
-.facebook-wrapper .prompt-container .question-container .choices .choice {
-  font-weight: bold;
-  background-color: #fbfbfb;
+.whatsapp-container footer, .instagram-container footer {
+  color: #979797;
+  font-size: 0.8571em;
+  text-align: center;
+  padding: 12px 0;
 }
-.facebook-wrapper button {
+.whatsapp-container button, .instagram-container button {
   background: transparent;
   border: 0;
   cursor: pointer;
-  font-family: inherit;
-  font-size: 14px;
 }
-.whatsapp-container {
-  --wa-message-margin: 40px;
-  --wa-message-border: 6px;
-  --wa-message-bg: #fff;
-  --wa-message-color: #0096de;
-  --wa-message-disabled-color: #aaa;
-  --wa-answers-bg: #d3ffc8;
-  --wa-answers-color: #000;
-  --wa-answers-radius: 6px;
-  --wa-message-width: calc(100% - var(--wa-message-margin) - 2px);
+.whatsapp-container .textarea-container, .instagram-container .textarea-container {
   display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  font-size: var(--fsc-font-size);
-  position: relative;
-  width: 340px;
-  height: 574px;
-  background-image: var(--fsc-whatsapp-bg);
-  background-repeat: no-repeat;
-  background-size: contain;
-  margin: 0 auto;
-  font-family: var(--fsc-default-font-family);
-  color: var(--default-question-text-color);
-}
-.whatsapp-container svg {
-  display: inline !important;
-}
-.whatsapp-container.instagram {
-  --wa-message-bg: none;
-  --wa-answers-bg: #4d5bff;
-  --wa-answers-color: #fff;
-  --wa-answers-radius: 21px;
-  background-image: var(--fsc-instagram-bg);
-}
-.whatsapp-container.instagram svg {
-  display: inline !important;
-}
-.whatsapp-container.instagram .msg-container {
-  position: relative;
-}
-.whatsapp-container.instagram .choices {
-  display: none;
-  flex-direction: row;
-  position: absolute;
-  bottom: 0;
-  margin-right: 0;
-  width: 93%;
+  gap: 8px;
+  padding: 10px 12px;
+  align-items: end;
+  background: #f6f6f6;
+  border-radius: 0 0 30px 30px;
 }
-.whatsapp-container.instagram .choices:before {
-  content: "";
-  display: block;
+.whatsapp-container textarea, .instagram-container textarea {
+  resize: none;
+  min-height: 40px;
+  max-height: 100px;
+  border-radius: 20px;
+  padding: 12px;
+  resize: none;
+  border: none;
   width: 100%;
-  position: absolute;
-  top: 0px;
-  border-top: 1px solid #e8e8e8;
-}
-.whatsapp-container.instagram .choices .choice {
-  border: 1px solid #0584fe;
-  border-radius: 50px;
-  color: #0584fe;
-  box-shadow: none;
-}
-.whatsapp-container.instagram .choices.one-line .range-choice,
-.whatsapp-container.instagram .choices.one-line .choice {
-  flex-grow: 0;
-}
-.whatsapp-container.instagram .question-container {
-  background: #efefef;
-  padding: 2px;
-  border-radius: 21px;
-}
-.whatsapp-container.instagram .question-container .options-popup {
-  display: flex;
-  overflow: auto;
-  flex-direction: row;
-  padding: 5px 0px 2px;
-  box-shadow: none;
-  border-top: 1px solid #e8e8e8;
-  border-radius: 0;
-  left: 7px;
-  min-height: 50px;
-  bottom: 0px;
-  width: calc(100% - 10px);
-}
-.whatsapp-container.instagram .question-container .options-popup footer,
-.whatsapp-container.instagram .question-container .options-popup header {
-  display: none;
-}
-.whatsapp-container.instagram .question-container .options-popup main {
-  display: flex;
-  padding: 6px;
-  gap: 6px;
-  height: -moz-fit-content;
-  height: fit-content;
-}
-.whatsapp-container.instagram .question-container .options-popup main .option-row {
-  border: 1px solid #0584fe;
-  border-radius: 50px;
-  padding: 5px 10px;
 }
-.whatsapp-container.instagram .question-container .options-popup main .option-row button {
-  color: var(--wa-message-color);
-  display: flex;
-  gap: 6px;
+.whatsapp-container textarea:focus, .instagram-container textarea:focus {
+  outline: none;
 }
-.whatsapp-container.instagram .question-container .choices-button.choice {
-  font-weight: 700;
-  font-size: 1em;
+.whatsapp-container textarea::placeholder, .instagram-container textarea::placeholder {
   line-height: 16px;
-  letter-spacing: -0.03em;
-  color: #333333;
-  border: none;
-  width: auto;
-  padding: 8px;
-  border-radius: 10px;
-  margin: 5px 10px 10px;
-  box-shadow: none;
-}
-.whatsapp-container.instagram .question-container .choices-button.choice svg {
-  display: none;
-}
-.whatsapp-container.instagram .question-container .question-text-container {
-  box-shadow: none;
-}
-.whatsapp-container.instagram .question-container.active {
-  margin-bottom: 40px;
-}
-.whatsapp-container.instagram .question-container.active .choices {
-  display: flex;
-  gap: 6px;
-  overflow: auto;
-  flex: 1;
-  background: #fff;
-  margin: 0;
-  padding-top: 8px;
+  padding-left: 2px;
 }
-.whatsapp-container.instagram .question-container.active .choices .choice button {
-  white-space: nowrap;
+.whatsapp-container .fsc-link-preview__meta__domain, .instagram-container .fsc-link-preview__meta__domain {
+  text-overflow: break-word;
+  word-break: break-word;
 }
-.whatsapp-container.instagram .question-container.active .choices.reply-buttons {
+
+.facebook-container .fb-wrapper {
+  width: 100%;
+  height: 100%;
   display: flex;
-  flex-wrap: nowrap;
-}
-.whatsapp-container.instagram .question-container.active .choices.multi-choice {
-  padding: 0;
-  margin: 0;
-}
-.whatsapp-container.instagram .question-container.active .choices.multi-choice::before {
-  content: none;
-}
-.whatsapp-container.instagram .textarea-container {
-  background: #fff;
-  margin-right: 23px;
-}
-.whatsapp-container.instagram .textarea-container textarea {
-  background: #e8e8e8;
-  border-radius: 18px;
-}
-.whatsapp-container.instagram .answers {
-  box-shadow: none;
-  margin-inline-end: 6px;
-}
-.whatsapp-container.whatsapp .choices .choice button {
-  min-height: 26px;
-}
-.whatsapp-container .ellipsis-wrapper {
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-.whatsapp-container .ellipsis-wrapper svg {
-  vertical-align: middle;
-}
-.whatsapp-container .star-rating-wrapper {
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-.whatsapp-container .star-rating-wrapper svg {
-  vertical-align: bottom;
+  align-items: center;
+  justify-content: center;
 }
-.whatsapp-container .msg-container {
-  margin-top: 80px;
-  margin-left: 18px;
-  margin-right: 20px;
+.facebook-container.fb-link-preview .msg-container {
   flex-grow: 1;
-  padding: 8px;
+  padding: 12px;
   overflow: hidden;
   display: flex;
+  background: #fff;
 }
-.whatsapp-container .scroll-wrapper {
+.facebook-container.fb-link-preview .msg-container .scroll-wrapper {
   display: flex;
   flex-direction: column;
-  align-items: baseline;
   gap: 12px;
-  overflow: scroll;
+  overflow-y: auto;
+  width: 100%;
 }
-.whatsapp-container .question-text.required::after {
-  content: "*";
-  color: rgb(215, 45, 48);
-  margin-left: 4px;
+.facebook-container.fb-link-preview .msg-container .scroll-wrapper .question-container {
+  align-self: flex-start;
+  max-width: 90%;
+  min-width: 150px;
+  display: flex;
+  flex-direction: column;
+  background-color: #f3f4f8;
+  border-radius: 2px 16px 16px 16px;
+  padding: 0;
 }
-.whatsapp-container .question-text {
-  transition: font-size var(--fsc-transition-duration) ease-in-out;
-  font-size: var(--question-font-size);
-  line-height: 18px;
-  padding: 12px;
-  background-color: var(--wa-message-bg);
-  border-radius: var(--wa-message-border);
+.facebook-container.fb-link-preview .msg-container .scroll-wrapper .question-container .fsc-link-preview {
+  border-radius: 16px 16px 16px 2px;
+  width: 100%;
+  max-width: 230px;
+  margin: 0;
+}
+.facebook-container.fb-link-preview .msg-container .scroll-wrapper .question-container .fsc-link-preview .fsc-link-preview__meta__domain {
+  font-size: 10px;
+  color: #3c3c3c;
+  text-overflow: break-word;
   word-break: break-word;
 }
-.whatsapp-container .question-text p {
-  text-align: left;
+.facebook-container.fb-link-preview .msg-container .scroll-wrapper .question-container .fsc-link-preview .fsc-link-preview__meta__description {
+  color: #3c3c3c;
 }
-.whatsapp-container .question-text a {
-  color: var(--link-color);
-  -webkit-text-decoration: underline;
-  text-decoration: underline;
+.facebook-container.fb-link-preview .msg-container .scroll-wrapper .question-container .fsc-link-preview a {
+  color: #0584fe;
+  -webkit-text-decoration: none;
+  text-decoration: none;
 }
-.whatsapp-container .question-text .placeholder-tag > span {
-  display: none !important;
+.facebook-container .facebook-wrapper {
+  /* === HEADER === */
 }
-.whatsapp-container .question-container {
-  max-width: var(--wa-message-width);
-  margin-inline-end: var(--wa-message-margin);
-  gap: 2px;
+.facebook-container .facebook-wrapper * {
+  scrollbar-width: none;
+  text-align: left !important;
+}
+.facebook-container .facebook-wrapper .mobile {
+  position: relative;
+  display: inline-block;
+}
+.facebook-container .facebook-wrapper .phone-frame {
+  position: relative;
+  width: 310px;
+  height: 574px;
+  background: #fff;
+  border: 10px solid #e5e5e5;
+  border-radius: 40px;
   display: flex;
   flex-direction: column;
-  pointer-events: none;
-  text-align: left;
-}
-.whatsapp-container .question-container .question-text-container {
-  box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 1px;
+  justify-content: space-between;
+  overflow: hidden;
 }
-.whatsapp-container .question-container.active {
-  pointer-events: initial;
+.facebook-container .facebook-wrapper .mobile-actions {
+  position: absolute;
+  left: -18px;
+  top: 140px;
+  right: -18px;
 }
-.whatsapp-container .question-container.active .choice {
-  color: var(--wa-message-color);
+.facebook-container .facebook-wrapper .mobile-actions .side-buttons {
+  position: absolute;
+  background: #e5e5e5;
 }
-.whatsapp-container .question-container.active .choice button {
-  color: var(--wa-message-color);
+.facebook-container .facebook-wrapper .mobile-actions .left-side-buttons-container {
+  position: absolute;
+  left: 10px;
+  top: 0;
 }
-.whatsapp-container .question-container.active .choice svg:not(#star) {
-  fill: var(--wa-message-color);
+.facebook-container .facebook-wrapper .mobile-actions .left-side-buttons-container .side-buttons.left {
+  width: 8px;
+  height: 55px;
+  border-radius: 4px 0 0 4px;
+  margin-bottom: 8px;
 }
-.whatsapp-container .question-container.active.open-modal {
-  margin-bottom: 45px;
+.facebook-container .facebook-wrapper .mobile-actions .left-side-buttons-container .side-buttons.left-2 {
+  width: 8px;
+  height: 55px;
+  border-radius: 4px 0 0 4px;
+  margin-top: 4rem;
 }
-.whatsapp-container .question-container#new {
-  margin-bottom: 10px;
+.facebook-container .facebook-wrapper .mobile-actions .side-buttons.right {
+  position: absolute;
+  right: 10px;
+  top: 0;
+  width: 8px;
+  height: 80px;
+  border-radius: 0 4px 4px 0;
 }
-.whatsapp-container .answers-container {
-  width: 100%;
+.facebook-container .facebook-wrapper .header {
   display: flex;
-  justify-content: end;
-  text-align: left;
-}
-.whatsapp-container .answers {
-  background: var(--wa-answers-bg);
-  margin-left: var(--wa-message-margin);
-  border-radius: var(--wa-answers-radius);
-  color: var(--wa-answers-color);
-  padding: 12px;
-  width: -moz-fit-content;
-  width: fit-content;
-  min-width: 80px;
-  font-size: 1.1429em;
-  box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 1px;
-  word-break: break-word;
-}
-.whatsapp-container .answers .reply-block {
-  background: rgba(0, 0, 0, 0.08);
-  margin: -6px -6px 4px;
-  padding: 5px 8px;
-  border-radius: 6px;
-  border-left: 3px solid #2c5cc5;
-}
-.whatsapp-container .answers .reply-block .user {
-  color: #2c5cc5;
-  font-weight: 600;
-  margin-bottom: 3px;
+  justify-content: space-between;
+  align-items: center;
+  padding: 12px 16px;
+  border-bottom: 1px solid #ddd;
+  background: #fff;
 }
-.whatsapp-container .answers:empty {
-  display: none;
+.facebook-container .facebook-wrapper .header .header-left {
+  display: flex;
+  align-items: center;
+  gap: 8px;
 }
-.whatsapp-container .answers .answer-text {
+.facebook-container .facebook-wrapper .header .fb-header-brand {
   display: flex;
   align-items: center;
+  gap: 6px;
 }
-.whatsapp-container .answers .answer-text span {
-  white-space: nowrap;
-}
-.whatsapp-container .options-popup {
-  position: absolute;
-  z-index: 1;
-  border-radius: 12px 12px 30px 30px;
-  background-color: #fff;
-  box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.06);
-  padding: 12px 8px;
-  bottom: 15px;
-  left: 18px;
-  right: 22px;
-  transform: translateY(80px);
-  transition: all linear 0.3s;
-  opacity: 0;
-}
-.whatsapp-container .fade-enter-active {
-  transform: translateY(0px);
-  opacity: 1;
-}
-.whatsapp-container .fade-enter-done {
-  transform: translateY(0px);
-  opacity: 1;
-}
-.whatsapp-container .fade-exit-active {
-  opacity: 0;
-  transform: translateY(80px);
+.facebook-container .facebook-wrapper .header .fb-header-brand .logo {
+  width: 28px;
+  height: 28px;
+  border-radius: 50%;
+  background: #20a849;
+  color: #fff;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-weight: bold;
+  font-size: 14px;
 }
-.whatsapp-container .fade-exit-done {
-  opacity: 0;
-  transform: translateY(80px);
+.facebook-container .facebook-wrapper .header .fb-header-brand .title {
+  font-weight: 600;
+  font-size: 14px;
+  color: #000;
 }
-.whatsapp-container .option-row {
-  padding-bottom: 16px;
+.facebook-container .facebook-wrapper .header .icon-blue {
+  color: #0084ff;
+  font-size: 18px;
+  cursor: pointer;
 }
-.whatsapp-container .option-row button {
+.facebook-container .facebook-wrapper .input-bar {
   display: flex;
   align-items: center;
-  flex-wrap: nowrap;
-  width: 100%;
+  padding: 8px;
+  border-top: 1px solid #ddd;
+  gap: 10px;
+  background: #fff;
 }
-.whatsapp-container .option-row button span {
-  white-space: nowrap;
+.facebook-container .facebook-wrapper .input-bar .input-icons {
+  display: flex;
+  gap: 12px;
+  color: #0084ff;
+  font-size: 18px;
 }
-.whatsapp-container header {
-  text-align: center;
+.facebook-container .facebook-wrapper .input-bar .input-icons svg {
+  width: 15px;
+  height: 20px;
+}
+.facebook-container .facebook-wrapper .input-bar .input-field {
+  flex: 1;
   display: flex;
   align-items: center;
-  padding-bottom: 20px;
-  position: relative;
-}
-.whatsapp-container main {
-  padding: 0 8px;
+  background: #f0f0f0;
+  border-radius: 20px;
+  padding: 6px 12px;
+  min-height: 32px;
 }
-.whatsapp-container .close-btn {
-  background: transparent;
+.facebook-container .facebook-wrapper .input-bar .input-field .text-input {
+  flex: 1;
   border: none;
-  width: 32px;
-  height: 32px;
-  position: absolute;
+  outline: none;
+  background: transparent;
+  font-size: 14px;
+}
+.facebook-container .facebook-wrapper .input-bar .input-field .text-input::placeholder {
+  color: #65676b;
 }
-.whatsapp-container .choices-button {
+.facebook-container .facebook-wrapper .input-bar .input-field .facebook-textarea-container {
   display: flex;
+  gap: 8px;
+  height: 32px;
   align-items: center;
-  justify-content: center;
   width: 100%;
-  gap: 12px;
 }
-.whatsapp-container.instagram .scroll-wrapper {
+.facebook-container .facebook-wrapper .input-bar .input-field .facebook-textarea-container textarea {
+  scrollbar-width: none;
+  resize: none;
+  height: 20px !important;
+  background: transparent;
+  border: none;
+  border-radius: 20px;
+  padding: 6px 12px;
   width: 100%;
+  font-size: 14px;
 }
-.whatsapp-container.instagram .choices.one-line {
-  flex-direction: row;
-  flex-wrap: nowrap;
+.facebook-container .facebook-wrapper .input-bar .input-field .facebook-textarea-container textarea:focus {
+  outline: none;
 }
-.whatsapp-container.instagram .choices.one-line .choice {
-  max-width: -moz-fit-content;
-  max-width: fit-content;
+.facebook-container .facebook-wrapper .input-bar .input-field .facebook-textarea-container textarea::placeholder {
+  color: #65676b;
+  line-height: 16px;
 }
-.whatsapp-container.instagram .choices.reply-buttons {
-  display: none;
+.facebook-container .facebook-wrapper .input-bar .thumbs {
+  font-size: 20px;
+  color: #0084ff;
+  cursor: pointer;
 }
-.whatsapp-container.instagram .choices.reply-buttons .reply-button {
-  width: -moz-fit-content;
-  width: fit-content;
-  max-width: -moz-fit-content;
-  max-width: fit-content;
-  flex: unset;
-  padding: 4px 12px;
+.facebook-wrapper {
+  /* === CHAT BODY === */
+  /* === QUESTION & MESSAGE STYLES === */
+  /* === ANSWER STYLES === */
+  /* === CHOICE BUTTONS === */
+  /* === QUICK REPLY BUTTONS === */
+  /* === INPUT BAR === */
+  /* === PROMPT STYLES === */
+  /* === UTILITY STYLES === */
 }
-.whatsapp-container.instagram .choices.reply-buttons .reply-button:only-child {
-  flex: 0 0 auto;
-  width: -moz-fit-content;
-  width: fit-content;
+.facebook-wrapper * {
+  scrollbar-width: none;
+  text-align: center !important;
 }
-.whatsapp-container .choices {
+.facebook-wrapper .fb-chat-body {
+  flex: 1;
   display: flex;
   flex-direction: column;
-  gap: 2px;
-  list-style-type: none;
-  padding: 5px 0;
-  margin: 0;
+  background: #fff;
+  padding: 12px;
+  overflow-y: auto;
 }
-.whatsapp-container .choices.multi-choice .choice button {
-  white-space: normal;
+.facebook-wrapper .fb-chat-body .fb-msg-container {
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+  overflow: hidden;
 }
-.whatsapp-container .choices.reply-buttons {
-  margin: 0;
+.facebook-wrapper .fb-chat-body .fb-msg-container .fb-scroll-wrapper {
   display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
+  flex-direction: column;
+  gap: 12px;
+  overflow-y: auto;
+  padding-bottom: 10px;
 }
-.whatsapp-container .choices.reply-buttons .reply-button {
-  padding: 4px 12px;
-  flex: 1 1 100%;
-  max-width: 100%;
+.facebook-wrapper .fb-question-container {
+  align-self: flex-start;
+  max-width: 90%;
+  min-width: 150px;
+  display: flex;
+  flex-direction: column;
+  pointer-events: none;
+  background-color: #f3f4f8;
+  border-radius: 2px 16px 16px 16px;
 }
-.whatsapp-container .choices.reply-buttons .reply-button:only-child {
-  flex: 1 1 100%;
+.facebook-wrapper .fb-question-container .question-text {
+  font-size: 14px;
+  line-height: 1.4;
+  padding: 10px 14px;
+  background-color: transparent;
+  border-radius: 18px;
+  word-break: break-word;
+  color: #000;
+  text-align: left !important;
+  overflow-wrap: break-word;
+  word-break: break-word;
+  hyphens: auto;
 }
-.whatsapp-container .choices.one-line {
-  flex-direction: unset;
-  flex-wrap: wrap;
-  padding: 0;
-  margin: 2px 0;
+.facebook-wrapper .fb-question-container .question-text.required::after {
+  content: "*";
+  color: #e74c3c;
+  margin-left: 4px;
 }
-.whatsapp-container .choices.one-line .range-choice,
-.whatsapp-container .choices.one-line .choice {
-  width: -moz-fit-content;
-  width: fit-content;
-  max-width: var(--wa-message-width);
+.facebook-wrapper .fb-question-container .question-text p {
+  margin: 0;
+  text-align: left;
 }
-.whatsapp-container .choices--vertical.one-line .choice {
-  width: 100%;
-  max-width: 100%;
+.facebook-wrapper .fb-question-container .question-text a {
+  color: #0084ff;
+  -webkit-text-decoration: underline;
+  text-decoration: underline;
 }
-.whatsapp-container .choice {
-  background-color: var(--wa-message-bg);
-  padding: 8px 12px;
-  border-radius: var(--wa-message-border);
-  text-align: center;
-  color: var(--wa-message-disabled-color);
-  box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 1px;
+.facebook-wrapper .fb-question-container .question-text .placeholder-tag > span {
+  display: none !important;
 }
-.whatsapp-container .choice button {
-  color: var(--wa-message-disabled-color);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 100%;
-  white-space: nowrap;
+.facebook-wrapper .fb-question-container.active {
+  pointer-events: initial;
 }
-.whatsapp-container .choice svg:not(#star) {
-  fill: var(--wa-message-disabled-color);
+.facebook-wrapper .fb-question-container.active .choices-button {
+  color: #000;
+  padding-left: 25px;
+  padding-right: 25px;
+  padding: 8px 12px;
+  margin: 10px;
+  border-radius: 8px;
+  font-weight: bold;
+  background-color: #fbfbfb;
+  overflow-wrap: break-word;
+  word-break: break-word;
+  hyphens: auto;
 }
-.whatsapp-container .range-choice {
-  padding-top: 4px;
-  padding-bottom: 4px;
+.facebook-wrapper .fb-question-container.active .choices-button button {
+  color: #000;
 }
-.whatsapp-container h4 {
-  margin: 0 auto;
-  font-weight: 500;
+.facebook-wrapper .fb-question-container.active .choices-button svg:not(#star) {
+  fill: #000;
 }
-.whatsapp-container footer {
-  color: #979797;
-  font-size: 0.8571em;
-  text-align: center;
-  padding: 12px 0;
+.facebook-wrapper .fb-question-container.active.open-modal {
+  margin-bottom: 45px;
 }
-.whatsapp-container button {
-  background: transparent;
-  border: 0;
-  cursor: pointer;
+.facebook-wrapper .fb-question-container#new {
+  margin-bottom: 10px;
 }
-.whatsapp-container .textarea-container {
+.facebook-wrapper .fb-answers-container {
+  align-self: flex-end;
   display: flex;
-  gap: 8px;
-  margin-left: 12px;
-  margin-right: 16px;
-  margin-bottom: 26px;
-  margin-top: 10px;
-  margin: 0 21px 15px 18px;
-  padding: 10px 12px;
-  align-items: end;
-  background: #f6f6f6;
-  border-radius: 0 0 30px 30px;
+  justify-content: flex-end;
+  margin-top: 8px;
+}
+.facebook-wrapper .fb-answers-container .fb-answers {
+  background: #0965ff;
+  color: #fff;
+  padding: 8px 14px;
+  border-radius: 18px;
+  font-size: 14px;
+  max-width: 240px;
+  display: inline-block;
+  align-items: center;
+  white-space: normal;
+  overflow-wrap: break-word;
+  word-break: break-word;
+  hyphens: auto;
+}
+.facebook-wrapper .fb-answers-container .fb-answers .reply-block {
+  background: rgba(255, 255, 255, 0.1);
+  margin: -6px -6px 4px;
+  padding: 5px 8px;
+  border-radius: 6px;
+  border-left: 3px solid #fff;
 }
-.whatsapp-container textarea {
-  resize: none;
-  min-height: 40px;
-  max-height: 100px;
-  border-radius: 20px;
-  padding: 12px;
-  resize: none;
-  border: none;
-  width: 100%;
+.facebook-wrapper .fb-answers-container .fb-answers .reply-block .user {
+  color: #fff;
+  font-weight: 600;
+  margin-bottom: 3px;
+  font-size: 12px;
 }
-.whatsapp-container textarea:focus {
-  outline: none;
+.facebook-wrapper .fb-answers-container .fb-answers .reply-block .question {
+  margin: 0;
+  font-size: 13px;
 }
-.whatsapp-container textarea::placeholder {
-  line-height: 16px;
-  padding-left: 2px;
+.facebook-wrapper .fb-answers-container .fb-answers:empty {
+  display: none;
 }
-
-.facebook-container .fb-wrapper {
-  width: 100%;
-  height: 100%;
+.facebook-wrapper .fb-answers-container .fb-answers .fb-answer-text {
   display: flex;
   align-items: center;
-  justify-content: center;
-}
-.facebook-container .facebook-wrapper {
-  /* === HEADER === */
-}
-.facebook-container .facebook-wrapper * {
-  scrollbar-width: none;
-  text-align: left !important;
+  gap: 4px;
+  overflow-wrap: break-word;
+  word-break: break-word;
+  hyphens: auto;
 }
-.facebook-container .facebook-wrapper .mobile {
-  position: relative;
-  display: inline-block;
+.facebook-wrapper .fb-answers-container .fb-answers .fb-answer-text span {
+  white-space: nowrap;
 }
-.facebook-container .facebook-wrapper .phone-frame {
-  position: relative;
-  width: 310px;
-  height: 574px;
-  background: #fff;
-  border: 10px solid #e5e5e5;
-  border-radius: 40px;
+.facebook-wrapper .fb-answers-container .fb-answers .fb-answer-text .fb-star-rating-wrapper {
   display: flex;
-  flex-direction: column;
-  justify-content: space-between;
+  align-items: center;
+  gap: 2px;
+  text-overflow: ellipsis;
   overflow: hidden;
 }
-.facebook-container .facebook-wrapper .phone-frame .fsc-link-preview {
-  border-radius: 16px 16px 16px 2px;
-  position: relative;
-  width: 230px;
+.facebook-wrapper .fb-answers-container .fb-answers .fb-answer-text .fb-star-rating-wrapper svg {
+  vertical-align: bottom;
+}
+.facebook-wrapper .fb-answers-container .fb-answers .fb-answer-text .fb-star-rating-wrapper span {
+  align-items: center;
+  overflow-wrap: break-word;
+  word-break: break-word;
+  hyphens: auto;
+}
+.facebook-wrapper .fb-answers-container .fb-answers .fb-answer-text .fb-emoji-rating-wrapper {
   display: flex;
   align-items: center;
-  justify-content: center;
-  margin: 12px;
-  margin-bottom: auto;
+  gap: 2px;
 }
-.facebook-container .facebook-wrapper .phone-frame .fsc-link-preview .fsc-link-preview__meta__domain {
-  font-size: 10px;
-  color: #3c3c3c;
+.facebook-wrapper .fb-answers-container .fb-answers .fb-answer-text .fb-emoji-rating-wrapper svg {
+  vertical-align: bottom;
 }
-.facebook-container .facebook-wrapper .phone-frame .fsc-link-preview .fsc-link-preview__meta__description {
-  color: #3c3c3c;
+.facebook-wrapper .fb-answers-container .fb-answers .fb-answer-text .fb-emoji-rating-wrapper span {
+  align-items: center;
+  white-space: normal;
+  overflow-wrap: break-word;
+  word-break: break-word;
+  hyphens: auto;
 }
-.facebook-container .facebook-wrapper .phone-frame .fsc-link-preview a {
-  color: #0584fe;
-  -webkit-text-decoration: none;
-  text-decoration: none;
+.facebook-wrapper .choices {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  margin-top: 0px;
+  list-style-type: none;
+  padding: 0;
+  overflow-wrap: break-word;
+  word-break: break-word;
+  hyphens: auto;
 }
-.facebook-container .facebook-wrapper .mobile-actions {
-  position: absolute;
-  left: -18px;
-  top: 140px;
-  right: -18px;
+.facebook-wrapper .choices svg:not(#star) {
+  width: 25px;
+  height: 25px;
+  flex-shrink: 0;
+  display: inline;
 }
-.facebook-container .facebook-wrapper .mobile-actions .side-buttons {
-  position: absolute;
-  background: #e5e5e5;
+.facebook-wrapper .choices svg#star {
+  vertical-align: bottom;
 }
-.facebook-container .facebook-wrapper .mobile-actions .left-side-buttons-container {
-  position: absolute;
-  left: 10px;
-  top: 0;
+.facebook-wrapper .choices.multi-choice .choice button {
+  white-space: normal;
 }
-.facebook-container .facebook-wrapper .mobile-actions .left-side-buttons-container .side-buttons.left {
-  width: 8px;
-  height: 55px;
-  border-radius: 4px 0 0 4px;
-  margin-bottom: 8px;
+.facebook-wrapper .choices.boolean-choices {
+  padding-left: 15px;
+  padding-right: 15px;
 }
-.facebook-container .facebook-wrapper .mobile-actions .left-side-buttons-container .side-buttons.left-2 {
-  width: 8px;
-  height: 55px;
-  border-radius: 4px 0 0 4px;
-  margin-top: 4rem;
+.facebook-wrapper .choices.boolean-choices:has(.choice:nth-child(2):last-child) {
+  flex-direction: row;
 }
-.facebook-container .facebook-wrapper .mobile-actions .side-buttons.right {
-  position: absolute;
-  right: 10px;
-  top: 0;
-  width: 8px;
-  height: 80px;
-  border-radius: 0 4px 4px 0;
+.facebook-wrapper .choices.boolean-choices:has(.choice:nth-child(2):last-child) .boolean-choice {
+  width: calc(80% - 16px);
+  border-radius: 8px;
 }
-.facebook-container .facebook-wrapper .header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 12px 16px;
-  border-bottom: 1px solid #ddd;
-  background: #fff;
+.facebook-wrapper .choices.boolean-choices .boolean-choice {
+  background-color: #e2e5ea !important;
 }
-.facebook-container .facebook-wrapper .header .header-left {
+.facebook-wrapper .choices.boolean-choices .boolean-choice button {
+  font-size: 14px;
+  font-weight: 500;
+  gap: 8px;
+  width: 100%;
+  padding: 6px 4px;
+  border: none;
   display: flex;
+  justify-content: center;
   align-items: center;
+}
+.facebook-wrapper .choices.dropdown-choices {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  padding: 0 12px;
   gap: 8px;
 }
-.facebook-container .facebook-wrapper .header .fb-header-brand {
+.facebook-wrapper .choices.dropdown-choices .dropdown-choice {
+  border-radius: 8px;
+  padding: 2px;
   display: flex;
+  text-align: center;
   align-items: center;
-  gap: 6px;
+  background-color: #e2e5ea !important;
 }
-.facebook-container .facebook-wrapper .header .fb-header-brand .logo {
-  width: 28px;
-  height: 28px;
-  border-radius: 50%;
-  background: #20a849;
-  color: #fff;
+.facebook-wrapper .choices.dropdown-choices .dropdown-choice:first-child {
+  grid-column: span 2;
+}
+.facebook-wrapper .choices.dropdown-choices .dropdown-choice button {
+  font-size: 14px;
+  font-weight: 500;
+  gap: 8px;
+  width: 100%;
+  padding: 6px;
+  border: none;
   display: flex;
   justify-content: center;
   align-items: center;
-  font-weight: bold;
-  font-size: 14px;
 }
-.facebook-container .facebook-wrapper .header .fb-header-brand .title {
+.facebook-wrapper .choices.dropdown-choices .dropdown-choice button .fb-star-rating-wrapper {
+  align-items: center;
+}
+.facebook-wrapper .choices.dropdown-choices .dropdown-choice button .fb-star-rating-wrapper svg {
+  vertical-align: bottom;
+}
+.facebook-wrapper .choices.dropdown-choices .action {
+  width: 100%;
+  padding: 2px;
+  border: none;
+  border-radius: 8px;
+  font-size: 15px;
   font-weight: 600;
-  font-size: 14px;
-  color: #000;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
-.facebook-container .facebook-wrapper .header .icon-blue {
-  color: #0084ff;
-  font-size: 18px;
+.facebook-wrapper .fb-quick-reply-area {
+  padding: 8px 12px 0;
+  background: #fff;
+  border-top: 1px solid #e4e6ea;
+}
+.facebook-wrapper .fb-quick-reply-area .fb-quick-reply-buttons {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  padding-bottom: 8px;
+}
+.facebook-wrapper .fb-quick-reply-area .fb-quick-reply-buttons.scrollable {
+  flex-wrap: nowrap;
+  overflow-x: auto;
+  scrollbar-width: none; /* Firefox */
+  -ms-overflow-style: none; /* IE and Edge */
+}
+.facebook-wrapper .fb-quick-reply-area .fb-quick-reply-buttons.scrollable::-webkit-scrollbar {
+  display: none; /* Chrome, Safari, Opera */
+}
+.facebook-wrapper .fb-quick-reply-area .fb-quick-reply-buttons .fb-quick-reply-button {
+  background: #fff;
+  border: 1px solid #1877f2;
+  color: #1877f2;
+  padding: 8px 16px;
+  border-radius: 20px;
+  font-size: 14px;
+  font-weight: 500;
   cursor: pointer;
+  transition: all 0.2s ease;
+  white-space: nowrap;
+  flex-shrink: 0; /* Prevent shrinking in scrollable mode */
 }
-.facebook-container .facebook-wrapper .input-bar {
+.facebook-wrapper .fb-quick-reply-area .fb-quick-reply-buttons .fb-quick-reply-button:hover {
+  background: #1877f2;
+  color: #fff;
+}
+.facebook-wrapper .fb-quick-reply-area .fb-quick-reply-buttons .fb-quick-reply-button:active {
+  transform: scale(0.98);
+}
+.facebook-wrapper .fb-quick-reply-area .fb-quick-reply-buttons .fb-quick-reply-button .fb-star-rating-wrapper {
+  display: flex;
+  align-items: baseline;
+  gap: 8px;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+.facebook-wrapper .fb-quick-reply-area .fb-quick-reply-buttons .fb-quick-reply-button .fb-star-rating-wrapper svg {
+  vertical-align: bottom;
+}
+.facebook-wrapper .fb-input-bar {
   display: flex;
   align-items: center;
   padding: 8px;
@@ -5325,17 +5240,22 @@ div.surveyserv-widget-container.compact-container-style .fsc-radio-group button.
   gap: 10px;
   background: #fff;
 }
-.facebook-container .facebook-wrapper .input-bar .input-icons {
+.facebook-wrapper .fb-input-bar .fb-input-icons {
   display: flex;
   gap: 12px;
   color: #0084ff;
   font-size: 18px;
 }
-.facebook-container .facebook-wrapper .input-bar .input-icons svg {
+.facebook-wrapper .fb-input-bar .fb-input-icons svg {
   width: 15px;
   height: 20px;
 }
-.facebook-container .facebook-wrapper .input-bar .input-field {
+.facebook-wrapper .fb-input-bar .input-container {
+  display: flex;
+  gap: 8px;
+  align-items: anchor-center;
+}
+.facebook-wrapper .fb-input-bar .input-container .input-field {
   flex: 1;
   display: flex;
   align-items: center;
@@ -5344,24 +5264,24 @@ div.surveyserv-widget-container.compact-container-style .fsc-radio-group button.
   padding: 6px 12px;
   min-height: 32px;
 }
-.facebook-container .facebook-wrapper .input-bar .input-field .text-input {
+.facebook-wrapper .fb-input-bar .input-container .input-field .text-input {
   flex: 1;
   border: none;
   outline: none;
   background: transparent;
   font-size: 14px;
 }
-.facebook-container .facebook-wrapper .input-bar .input-field .text-input::placeholder {
+.facebook-wrapper .fb-input-bar .input-container .input-field .text-input::placeholder {
   color: #65676b;
 }
-.facebook-container .facebook-wrapper .input-bar .input-field .facebook-textarea-container {
+.facebook-wrapper .fb-input-bar .input-container .input-field .facebook-textarea-container {
   display: flex;
   gap: 8px;
   height: 32px;
   align-items: center;
   width: 100%;
 }
-.facebook-container .facebook-wrapper .input-bar .input-field .facebook-textarea-container textarea {
+.facebook-wrapper .fb-input-bar .input-container .input-field .facebook-textarea-container textarea {
   scrollbar-width: none;
   resize: none;
   height: 20px !important;
@@ -5371,18 +5291,46 @@ div.surveyserv-widget-container.compact-container-style .fsc-radio-group button.
   padding: 6px 12px;
   width: 100%;
   font-size: 14px;
+  text-align: left !important;
 }
-.facebook-container .facebook-wrapper .input-bar .input-field .facebook-textarea-container textarea:focus {
+.facebook-wrapper .fb-input-bar .input-container .input-field .facebook-textarea-container textarea:focus {
   outline: none;
 }
-.facebook-container .facebook-wrapper .input-bar .input-field .facebook-textarea-container textarea::placeholder {
+.facebook-wrapper .fb-input-bar .input-container .input-field .facebook-textarea-container textarea::placeholder {
   color: #65676b;
   line-height: 16px;
 }
-.facebook-container .facebook-wrapper .input-bar .thumbs {
+.facebook-wrapper .fb-input-bar .input-container .icon-container button {
+  width: 20px;
+  margin-right: 4px;
+  margin-top: 4px;
+}
+.facebook-wrapper .fb-input-bar .thumbs {
   font-size: 20px;
   color: #0084ff;
+}
+.facebook-wrapper .fb-prompt-container {
+  margin-bottom: 12px;
+}
+.facebook-wrapper .fb-prompt-container .fb-question-container {
+  background-color: #f0f0f0;
+  border-radius: 2px 16px 16px 16px;
+}
+.facebook-wrapper .fb-prompt-container .fb-question-container .choices {
+  padding-left: 25px;
+  padding-right: 25px;
+  font-weight: bold;
+}
+.facebook-wrapper .fb-prompt-container .fb-question-container .choices .choice {
+  font-weight: bold;
+  background-color: #fbfbfb;
+}
+.facebook-wrapper button {
+  background: transparent;
+  border: 0;
   cursor: pointer;
+  font-family: inherit;
+  font-size: 14px;
 }
 .fsc-link-preview {
   font-size: var(--fsc-font-size);