From 682d820f2ce6bf8235b1b987f1d6ad77fe4855f5 Mon Sep 17 00:00:00 2001
From: Oliver <oliver@odoo4projects.com>
Date: Mon, 28 Jul 2025 08:35:19 -0300
Subject: [PATCH] css

---
 public/style.css                  | 184 -----------------------------
 public/widget/custom/brandize.css | 188 ++++++++++++++++++++++++++++++
 public/widget/custom/od8n.css     | 186 +++++++++++++++++++++++++++++
 3 files changed, 374 insertions(+), 184 deletions(-)

diff --git a/public/style.css b/public/style.css
index 9e1d8a9..a46bebc 100644
--- a/public/style.css
+++ b/public/style.css
@@ -284,189 +284,5 @@ footer a:hover {
   font-size: 0.9rem;
 }
 
-/* cw.css */
 
-/* Container */
-#cw-chatToggle {
-  position: fixed;
-  bottom: 24px;
-  right: 24px;
-  background-color: #FFA500;
-  color: white;
-  padding: 12px 16px;
-  border-radius: 25px;
-  font-weight: 600;
-  cursor: pointer;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 4px;
-  z-index: 100000;
-  border: none;
-  user-select: none;
-  transition: background-color 0.3s ease;
-}
-#cw-chatToggle:hover {
-  transform: translateY(-5px);
-}
-#cw-chatToggle div {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-#cw-chatToggle img {
-  image-rendering: pixelated;
-  image-rendering: optimizeQuality;
-  image-rendering: -webkit-optimize-contrast; /* Chrome */
-  image-rendering: crisp-edges;              /* Fallback */
-}
-#cw-chatToggle span.text-sm {
-  font-weight: 500;
-  font-size: 0.875rem; /* 14px */
-}
-#cw-chatToggle span.text-xs {
-  font-size: 0.75rem; /* 12px */
-}
-
-/* Chat widget container */
-#cw-chatWidget {
-  display: none;
-  position: fixed;
-  bottom: 100px;
-  right: 24px;
-  width: 500px;
-  max-height: 70vh;
-  background: white;
-  border: 1px solid #ccc;
-  border-radius: 12px;
-  flex-direction: column;
-  z-index: 100000;
-  font-family: system-ui, sans-serif;
-}
-#cw-chatWidget.active {
-  display: flex;
-}
-
-/* Logo container */
-#cw-chatWidget .logo-container {
-  display: flex;
-  justify-content: center;
-  padding-top: 16px;
-  padding-bottom: 10px;
-}
-#cw-chatWidget .logo-container img {
-  height: 60px;
-  user-select: none;
-  image-rendering: optimizeQuality;
-  image-rendering: pixelated;
-  image-rendering: -webkit-optimize-contrast; /* Chrome */
-  image-rendering: crisp-edges;              /* Fallback */
-}
-
-/* Header */
-#cw-status {
-  padding: 10px 10px;
-  background-color: #f0f0f0;
-  border-bottom: 1px solid #ddd;
-  max-height: 0;
-  transition: max-height 0.5s ease-in-out, padding 0.5s ease-in-out;
-}
-
-#cw-chatWidget .header {
-  background-color: #0070c0;
-  color: white;
-  padding: 8px 16px;
-  font-weight: 600;
-  text-align: center;
-  user-select: none;
-}
-
-/* Messages container */
-#cw-chatMessages {
-  flex: 1 1 auto;
-  overflow-y: auto;
-  padding: 16px;
-  font-size: 0.875rem;
-  line-height: 1.4;
-  user-select: text;
-  scroll-behavior: smooth;
-  background: #fafafa;
-}
-
-/* Chat form */
-#cw-chatForm {
-  display: flex;
-  margin: 0px;
-  border-top: 1px solid #ddd;
-}
-#cw-chatInput {
-  flex: 1;
-  border: none;
-  padding: 8px 20px;
-  font-size: 1rem;
-  outline-offset: 2px;
-  border-radius: 0 0 0 12px;
-}
-#cw-chatInput:focus {
-  outline: 0px solid #0070c0;
-}
-#cw-chatForm button {
-  background-color: #0070c0;
-  border: none;
-  color: white;
-  padding: 0 16px;
-  cursor: pointer;
-  font-weight: 600;
-  border-radius: 0 0 12px 0;
-  transition: background-color 0.3s ease;
-}
-#cw-chatForm button:hover {
-  background-color: #005a9e;
-}
-
-/* Message bubbles */
-.cw-message {
-  max-width: 75%;
-  margin-bottom: 8px;
-  padding: 8px 12px;
-  border-radius: 12px;
-  word-wrap: break-word;
-  white-space: pre-wrap;
-}
-.cw-message.user {
-  background-color: #DCF8C6;
-  color: #333;
-  margin-left: auto;
-  text-align: right;
-}
-.cw-message.bot {
-  background-color: #E0E0E0;
-  color: #333;
-  margin-right: auto;
-  text-align: left;
-}
-
-.button {
-  display: inline-block;
-  padding: 12px 24px;
-  background-color: #4CAF50; /* Green */
-  color: white;
-  text-align: center;
-  text-decoration: none;
-  border-radius: 8px;
-  font-size: 16px;
-  font-weight: bold;
-  transition: background-color 0.3s ease, box-shadow 0.3s ease;
-  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-}
-
-.button:hover {
-  background-color: #45a049;
-  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
-}
-
-.button:active {
-  background-color: #3e8e41;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-}
 
diff --git a/public/widget/custom/brandize.css b/public/widget/custom/brandize.css
index 4a57d4f..769d454 100644
--- a/public/widget/custom/brandize.css
+++ b/public/widget/custom/brandize.css
@@ -1,3 +1,191 @@
+/* cw.css */
+
+/* Container */
+#cw-chatToggle {
+  position: fixed;
+  bottom: 24px;
+  right: 24px;
+  background-color: #FFA500;
+  color: white;
+  padding: 12px 16px;
+  border-radius: 25px;
+  font-weight: 600;
+  cursor: pointer;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  z-index: 100000;
+  border: none;
+  user-select: none;
+  transition: background-color 0.3s ease;
+}
+#cw-chatToggle:hover {
+  transform: translateY(-5px);
+}
+#cw-chatToggle div {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+#cw-chatToggle img {
+  image-rendering: pixelated;
+  image-rendering: optimizeQuality;
+  image-rendering: -webkit-optimize-contrast; /* Chrome */
+  image-rendering: crisp-edges;              /* Fallback */
+}
+#cw-chatToggle span.text-sm {
+  font-weight: 500;
+  font-size: 0.875rem; /* 14px */
+}
+#cw-chatToggle span.text-xs {
+  font-size: 0.75rem; /* 12px */
+}
+
+/* Chat widget container */
+#cw-chatWidget {
+  display: none;
+  position: fixed;
+  bottom: 100px;
+  right: 24px;
+  width: 500px;
+  max-height: 70vh;
+  background: white;
+  border: 1px solid #ccc;
+  border-radius: 12px;
+  flex-direction: column;
+  z-index: 100000;
+  font-family: system-ui, sans-serif;
+}
+#cw-chatWidget.active {
+  display: flex;
+}
+
+/* Logo container */
+#cw-chatWidget .logo-container {
+  display: flex;
+  justify-content: center;
+  padding-top: 16px;
+  padding-bottom: 10px;
+}
+#cw-chatWidget .logo-container img {
+  height: 60px;
+  user-select: none;
+  image-rendering: optimizeQuality;
+  image-rendering: pixelated;
+  image-rendering: -webkit-optimize-contrast; /* Chrome */
+  image-rendering: crisp-edges;              /* Fallback */
+}
+
+/* Header */
+#cw-status {
+  padding: 10px 10px;
+  background-color: #f0f0f0;
+  border-bottom: 1px solid #ddd;
+  max-height: 0;
+  transition: max-height 0.5s ease-in-out, padding 0.5s ease-in-out;
+}
+
+#cw-chatWidget .header {
+  background-color: #0070c0;
+  color: white;
+  padding: 8px 16px;
+  font-weight: 600;
+  text-align: center;
+  user-select: none;
+}
+
+/* Messages container */
+#cw-chatMessages {
+  flex: 1 1 auto;
+  overflow-y: auto;
+  padding: 16px;
+  font-size: 0.875rem;
+  line-height: 1.4;
+  user-select: text;
+  scroll-behavior: smooth;
+  background: #fafafa;
+}
+
+/* Chat form */
+#cw-chatForm {
+  display: flex;
+  margin: 0px;
+  border-top: 1px solid #ddd;
+}
+#cw-chatInput {
+  flex: 1;
+  border: none;
+  padding: 8px 20px;
+  font-size: 1rem;
+  outline-offset: 2px;
+  border-radius: 0 0 0 12px;
+}
+#cw-chatInput:focus {
+  outline: 0px solid #0070c0;
+}
+#cw-chatForm button {
+  background-color: #0070c0;
+  border: none;
+  color: white;
+  padding: 0 16px;
+  cursor: pointer;
+  font-weight: 600;
+  border-radius: 0 0 12px 0;
+  transition: background-color 0.3s ease;
+}
+#cw-chatForm button:hover {
+  background-color: #005a9e;
+}
+
+/* Message bubbles */
+.cw-message {
+  max-width: 75%;
+  margin-bottom: 8px;
+  padding: 8px 12px;
+  border-radius: 12px;
+  word-wrap: break-word;
+  white-space: pre-wrap;
+}
+.cw-message.user {
+  background-color: #DCF8C6;
+  color: #333;
+  margin-left: auto;
+  text-align: right;
+}
+.cw-message.bot {
+  background-color: #E0E0E0;
+  color: #333;
+  margin-right: auto;
+  text-align: left;
+}
+
+.button {
+  display: inline-block;
+  padding: 12px 24px;
+  background-color: #4CAF50; /* Green */
+  color: white;
+  text-align: center;
+  text-decoration: none;
+  border-radius: 8px;
+  font-size: 16px;
+  font-weight: bold;
+  transition: background-color 0.3s ease, box-shadow 0.3s ease;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+}
+
+.button:hover {
+  background-color: #45a049;
+  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
+}
+
+.button:active {
+  background-color: #3e8e41;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+}
+
+
+
 
 /* Headline above the wizard */
 .wizard-headline {
diff --git a/public/widget/custom/od8n.css b/public/widget/custom/od8n.css
index 4a57d4f..c4d8aa0 100644
--- a/public/widget/custom/od8n.css
+++ b/public/widget/custom/od8n.css
@@ -1,3 +1,189 @@
+/* cw.css */
+
+/* Container */
+#cw-chatToggle {
+  position: fixed;
+  bottom: 24px;
+  right: 24px;
+  background-color: #FFA500;
+  color: white;
+  padding: 12px 16px;
+  border-radius: 25px;
+  font-weight: 600;
+  cursor: pointer;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  z-index: 100000;
+  border: none;
+  user-select: none;
+  transition: background-color 0.3s ease;
+}
+#cw-chatToggle:hover {
+  transform: translateY(-5px);
+}
+#cw-chatToggle div {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+#cw-chatToggle img {
+  image-rendering: pixelated;
+  image-rendering: optimizeQuality;
+  image-rendering: -webkit-optimize-contrast; /* Chrome */
+  image-rendering: crisp-edges;              /* Fallback */
+}
+#cw-chatToggle span.text-sm {
+  font-weight: 500;
+  font-size: 0.875rem; /* 14px */
+}
+#cw-chatToggle span.text-xs {
+  font-size: 0.75rem; /* 12px */
+}
+
+/* Chat widget container */
+#cw-chatWidget {
+  display: none;
+  position: fixed;
+  bottom: 100px;
+  right: 24px;
+  width: 500px;
+  max-height: 70vh;
+  background: white;
+  border: 1px solid #ccc;
+  border-radius: 12px;
+  flex-direction: column;
+  z-index: 100000;
+  font-family: system-ui, sans-serif;
+}
+#cw-chatWidget.active {
+  display: flex;
+}
+
+/* Logo container */
+#cw-chatWidget .logo-container {
+  display: flex;
+  justify-content: center;
+  padding-top: 16px;
+  padding-bottom: 10px;
+}
+#cw-chatWidget .logo-container img {
+  height: 60px;
+  user-select: none;
+  image-rendering: optimizeQuality;
+  image-rendering: pixelated;
+  image-rendering: -webkit-optimize-contrast; /* Chrome */
+  image-rendering: crisp-edges;              /* Fallback */
+}
+
+/* Header */
+#cw-status {
+  padding: 10px 10px;
+  background-color: #f0f0f0;
+  border-bottom: 1px solid #ddd;
+  max-height: 0;
+  transition: max-height 0.5s ease-in-out, padding 0.5s ease-in-out;
+}
+
+#cw-chatWidget .header {
+  background-color: #0070c0;
+  color: white;
+  padding: 8px 16px;
+  font-weight: 600;
+  text-align: center;
+  user-select: none;
+}
+
+/* Messages container */
+#cw-chatMessages {
+  flex: 1 1 auto;
+  overflow-y: auto;
+  padding: 16px;
+  font-size: 0.875rem;
+  line-height: 1.4;
+  user-select: text;
+  scroll-behavior: smooth;
+  background: #fafafa;
+}
+
+/* Chat form */
+#cw-chatForm {
+  display: flex;
+  margin: 0px;
+  border-top: 1px solid #ddd;
+}
+#cw-chatInput {
+  flex: 1;
+  border: none;
+  padding: 8px 20px;
+  font-size: 1rem;
+  outline-offset: 2px;
+  border-radius: 0 0 0 12px;
+}
+#cw-chatInput:focus {
+  outline: 0px solid #0070c0;
+}
+#cw-chatForm button {
+  background-color: #0070c0;
+  border: none;
+  color: white;
+  padding: 0 16px;
+  cursor: pointer;
+  font-weight: 600;
+  border-radius: 0 0 12px 0;
+  transition: background-color 0.3s ease;
+}
+#cw-chatForm button:hover {
+  background-color: #005a9e;
+}
+
+/* Message bubbles */
+.cw-message {
+  max-width: 75%;
+  margin-bottom: 8px;
+  padding: 8px 12px;
+  border-radius: 12px;
+  word-wrap: break-word;
+  white-space: pre-wrap;
+}
+.cw-message.user {
+  background-color: #DCF8C6;
+  color: #333;
+  margin-left: auto;
+  text-align: right;
+}
+.cw-message.bot {
+  background-color: #E0E0E0;
+  color: #333;
+  margin-right: auto;
+  text-align: left;
+}
+
+.button {
+  display: inline-block;
+  padding: 12px 24px;
+  background-color: #4CAF50; /* Green */
+  color: white;
+  text-align: center;
+  text-decoration: none;
+  border-radius: 8px;
+  font-size: 16px;
+  font-weight: bold;
+  transition: background-color 0.3s ease, box-shadow 0.3s ease;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+}
+
+.button:hover {
+  background-color: #45a049;
+  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
+}
+
+.button:active {
+  background-color: #3e8e41;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+}
+
 
 /* Headline above the wizard */
 .wizard-headline {