{
  "general": {
    "brandColour": "#303030", // Launcher, widget header, pre chat form etc
    "brandSecondaryColour": "#fff", // Colour of text / icons in branded areas
    "chatBackgroundColour": "#fff", // Chat widget background colour
    "errorColour": "#da1e28", // Error text, error banner etc
    "widgetRadius": "16px", // Widget dialog and overlays border radius
    "buttonRadius": "10px" // Buttons border radius
  },
  "launcher": {
    "backgroundColour": "#222", // Launcher background colour
    "iconColour": "#fff", // Launcher icon colour
    "borderColour": "#222" // Launcher border colour
  },
  "chatInput": {
    "borderColour": "#858585", // Chat input border colour
    "borderHoverColour": "#000", // Chat input border hover colour
    "sendButtonIconColour": "#262626", // Send message icon colour
    "messageLimitTextColour": "#4d4d4d", // Character limit text colour
    "uploadButtonIconColour": "#222222", // Upload attachment icon colour
    "uploadButtonIconHoverColour": "#7F7F7F", // Upload attachment icon hover colour
    "glowColours": ["#007BFF", "#9B5DE5", "#00FFFF", "#3A0CA3"] // Border glow effect colours
  },
  "messages": {
    "userBubbleColour": "#000", // User message bubble colour
    "userTextColour": "#fff", // User message text colour
    "botBubbleColour": "#f4f4f4", // Bot message bubble colour
    "botTextColour": "#222222", // Bot message text colour
    "borderRadius": "20px" // User & Bot message bubble radius
  },
  "quickReplies": {
    "borderColour": "#f5f5f5", // Quick reply border colour
    "backgroundColour": "#fff", // Quick reply background colour
    "backgroundHoverColour": "#f5f5f5", // Quick reply background hover colour
    "backgroundActiveColour": "#eaeaea", // Quick reply active background colour
    "textColour": "#000028", // Quick reply text colour
    "textHoverColour": "#000028", // Quick reply text hover colour
    "display": "inline" | "vertical" // Determines whether to show the quick replies inline or vertically
  },
  "carousel": {
    "slideBorderColour": "#e2e2e2", // Slide border colour
    "imageBackgroundColour": "#f5f3f2", // Image background colour, only visible for .png images
    "arrowsColour": "#000", // Navigation arrows icon colour
    "arrowsCircleColour": "#fff", // Carousel navigation arrows background colour
    "descriptionTextColour": "#2c2c2c", // Description text colour
    "priceBorderColour": "#5b697d", // Price border colour
    "priceTextColour": "#29313d", // Price text colour
    "variantNameTextColour": "#5c5c5c", // Variant name text colour
    "variantActiveStyle": "shadow" // Variant style when active, "shadow" | "border"
  },
  "messageFeedback": {
    "iconsColour": "#191919", // Icons colour when unselected
    "iconsHoverColour": "#787878", // Icons hover colour when unselected
    "positiveFeedbackColour": "#11a193", // Positive feedback icon and border colour
    "negativeFeedbackColour": "#ad020b" // Negative feedback icon and border colour
  },
  "listPopup": {
    "backgroundHoverColour": "#f9f9f9", // List item background hover colour
    "backgroundActiveColour": "#eaeaea", // List item background active / selected colour
    "borderColour": "#eeeeee", // List item border colour
    "descriptionTextColour": "#6E7075", // Description text colour
    "imageBorderColour": "#bdbdbd", // List item image border colour
    "infoTextColour": "#5c5c5c" // List item info text colour
  },
  "avatar": {
    "textColour": "#fff", // Text colour of avatar text (when no image is provided)
    "backgroundColour": "#303030" // Avatar background colour (when no image is provided) - falls back to brand
  },
  "typingIndicator": {
    "dotsColour": "#2a2a2a" // Base dots colour, the animation affects the opacity of this
  },
  "endChatPopup": {
    "cancelButtonBackgroundColour": "none", // Cancel button background colour
    "cancelButtonTextColour": "#000", // Cancel button text colour
    "endChatButtonVariant": "danger" // "danger" or "brand". End chat button variant, "danger" applies red destructive colours, "brand" will apply brandColour and brandSecondary.
  },
  "prechatForm": {
    "variant": "solid", // Alters the prechat form background style: solid | gradient | diagonal | horizontal
    "backgroundColour": "#303030", // (optional) Prechat form background colour - falls back to brandColour
    "welcomeMessageTextColour": "#fff", // Welcome message text colour
    "inputTextColour": "#222", // Input text colour
    "inputBackgroundColour": "#fff", // Input background colour
    "suffixTextColour": "#6E7075", // Suffix text colour
    "iconsColour": "#fff", // Header icons colour
    "radialColours": ["#B1F8FF", "#CCD2FF", "#FBC"] // Colours of the "radial" variant gradient.
  },
  "proactiveButtons": {
    "closeIconColour": "#000", // Close icon colour
    "shadowHoverColour": "#333333", // Button hover shadow colour
    "questionBubbleColour": "#303030", // Question bubble colour
    "questionTextColour": "#fff", // Question text colour
    "answerBubbleColour": "#fff", // Answer bubble colour
    "answerBorderColour": "#000", // Answer border colour
    "answerTextColour": "#000" // Answer text colour
  },
  "calendar": {
    "submitButtonBgColour": "#303030", // Submit button background colour
    "submitButtonBgHoverColour": "#4a4a4a", // Submit button background colour
    "submitButtonTextColour": "#fff", // Submit button text colour
    "selectedDateBgColour": "#2c2c2c", // Selected data background colour
    "selectedDateTextColour": "#fff", // Selected date text colour
    "dateHoverBgColour": "#787878", // Date hover background colour
    "dateHoverTextColour": "#fff" // Date hover text colour
  },
  "badge": {
    "backgroundColour": "#5b697d", // Badge background colour
    "textColour": "#fff" // Badge text colour
  },
  "backToBottomButton": {
    "backgroundColour": "#fff", // Button background colour
    "iconColour": "#2C2C2C", // Icon colour
    "unreadCountBackgroundColour": "#f13d33", // Unread count background colour
    "unreadCountTextColour": "#fff" // Unread count text colour
  },
  "returnsPortal": {
    "portalBackgroundColour": "#fff", // background colour of the portal
    "primaryBackgroundColour": "#f5f5f5", // background colour of cards / headers etc
    "secondaryBackgroundColour": "#434343", // background colour of secondary cards / headers etc
    "locationOpenColour": "#11A193", // location open colour
    "locationClosedColour": "#DA1E28", // location closed colour
    "locationClosingSoonColour": "#DC9326" // location closing soon colour
  },
  "tooltip": {
    "backgroundColour": "#6A6A6A", // Tooltip background colour
    "textColour": "#fff" // Tooltip text colour
  },
  "primaryButton": {
    "backgroundColour": "#222", // Background colour
    "textColour": "#fff", // Text colour
  },
  "secondaryButton": {
    "borderColour": '#D6D8DC', // Border colour
    "borderHoverColour": '#CCCED1', // Border hover colour
    "backgroundColour": '#fff', // Background colour
    "backgroundHoverColour": '#EDECEC', // Background hover color
    "backgroundActiveColour": '#B8B8B8', // Background active / clicked colour
    "textColour": '#222', // Text colour
    "textHoverColour": '#222', // Text hover colour
  },
  "breakpoints": {
    "mobile": "800px" // The viewport width at which the widget becomes fullscreen.
  }
}