:root {
--primary-chat-ai-color: #0073aa;
--primary-chat-ai-logo-color: #FFFFFF;
--secondary-chat-ai-color: #005f94;
--chat-ai-btn-top: auto;
--chat-ai-btn-right: 20px;
--chat-ai-btn-bottom: 20px;
--chat-ai-btn-left: auto;
--chat-ai-win-top: auto;
--chat-ai-win-right: 20px;
--chat-ai-win-bottom: 90px;
--chat-ai-win-left: auto;
--chat-ai-font-family: Arial, sans-serif;
--chat-ai-font-size: 14px;
}
#chat-toggle {
position: fixed;
top: var(--chat-ai-btn-top);
right: var(--chat-ai-btn-right);
bottom: var(--chat-ai-btn-bottom);
left: var(--chat-ai-btn-left);
background: linear-gradient(135deg, var(--primary-chat-ai-color), var(--secondary-chat-ai-color));
color: var(--primary-chat-ai-logo-color);
font-size: 24px;
width: 60px;
height: 60px;
border-radius: 50%;
text-align: center;
line-height: 60px;
cursor: pointer;
box-shadow: 0 8px 16px rgba(0,0,0,0.3);
z-index: 1000;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
#chat-toggle.chat-toggle-1 svg {
margin-top: 14px;
}
#chat-toggle.chat-toggle-2 svg {
margin-top: 14px;
}
#chat-toggle #chat-notif {
position: absolute;
top: -6px;
right: -6px;
width: 20px;
height: 20px;
background: red;
color: #fff;
font-size: 12px;
border-radius: 50%;
line-height: 20px;
display: none;
}
#chat-toggle:hover {
transform: scale(1.1);
box-shadow: 0 12px 24px rgba(0,0,0,0.4);
}
#chat-window {
position: fixed;
top: var(--chat-ai-win-top);
right: var(--chat-ai-win-right);
bottom: var(--chat-ai-win-bottom);
left: var(--chat-ai-win-left);
width: 350px;
max-height: 600px;
background-color: white;
border: 1px solid #ccc;
border-radius: 10px;
display: flex;
flex-direction: column;
box-shadow: 0 8px 20px rgba(0,0,0,0.25);
z-index: 1000;
overflow: hidden;
font-family: var(--chat-ai-font-family);
font-size: var(--chat-ai-font-size);
opacity: 0;
visibility: hidden;
transform: translateY(20px) scale(0.95);
pointer-events: none;
transition: all 0.3s ease;
}
#chat-window.open {
opacity: 1;
visibility: visible;
transform: translateY(0) scale(1);
pointer-events: all;
} #chat-header {
background-color: var(--primary-chat-ai-color);
color: var(--primary-chat-ai-logo-color);
padding: 10px;
font-weight: bold;
display: flex;
justify-content: space-between;
align-items: center;
}
#chat-header button {
border: none;
background: none;
margin: auto 0;
color: var(--primary-chat-ai-logo-color);
}
#chat-header button:hover {
border: none;
background: none;
} #chat-messages {
padding: 10px;
flex: 1;
overflow-y: auto;
min-height: 400px;
height: 400px;
}
#chat-messages .message {
margin-bottom: 10px;
padding: 8px 12px;
border-radius: 10px;
max-width: 80%;
clear: both;
font-size: small;
overflow-wrap: anywhere;
animation: fade-in 0.25s ease;
}
#chat-messages .message.sent {
background-color: #DCF8C6;
align-self: flex-end;
text-align: right;
margin-left: auto;
}
#chat-messages .message.received {
background-color: #f1f0f0;
align-self: flex-start;
}
#chat-messages .timestamp {
font-size: 11px;
color: #888;
text-align: right;
} #chat-input {
display: flex;
border-top: 1px solid #ddd;
align-items: center;
}
#chat-input input {
flex: 1;
border: none;
padding: 10px;
outline: none;
border-radius: 0;
min-width: 0;
margin: 0;
height: 40px;
font-size: 0.9rem;
background-color: white;
}
#chat-input input:focus {
background-color: #f9f9f9;
}
#chat-input button {
background-color: var(--primary-chat-ai-color);
color: var(--primary-chat-ai-logo-color);
border: none;
padding: 10px 15px;
cursor: pointer;
transition: background-color 0.3s ease;
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
margin: 0;
height: 40px;
border-radius: 0;
}
#chat-header svg {
vertical-align: middle;
}
#chat-input button:hover {
background-color: var(--secondary-chat-ai-color);
}
#chat-messages .chat-loading {
display: flex;
align-items: center;
padding: 8px 12px;
margin: 10px 0;
background: #f1f1f1;
border-radius: 16px;
max-width: fit-content;
font-style: italic;
font-size: 14px;
color: #666;
}
#chat-messages .chat-loading .dot {
width: 6px;
height: 6px;
margin: 0 2px;
background-color: #333;
border-radius: 50%;
animation: blink 1.4s infinite both;
}
#chat-messages .chat-loading .dot:nth-child(2) {
animation-delay: 0.2s;
}
#chat-messages .chat-loading .dot:nth-child(3) {
animation-delay: 0.4s;
}
@keyframes blink {
0%, 80%, 100% {
opacity: 0;
}
40% {
opacity: 1;
}
}
@keyframes fade-in {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
} #chat-rating {
padding: 10px;
display: none;
flex-direction: column;
gap: 8px;
border-top: 1px solid #ddd;
}
#chat-rating.message,
#chat-thank.message {
background-color: #f1f0f0;
border-radius: 10px;
max-width: 80%;
align-self: flex-start;
margin-bottom: 10px;
border-top: none;
}
#chat-rating p {
margin-bottom: 0px;
}
#chat-rating button {
background-color: transparent;
border: 1px solid var(--primary-chat-ai-color);
border-radius: 3px;
color: var(--primary-chat-ai-color);
display: inline-block;
font-size: 1rem;
font-weight: 400;
padding: .5rem 1rem;
text-align: center;
transition: all .3s;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
}
#chat-rating button:hover {
background-color: var(--primary-chat-ai-color);
color: white;
}
#chat-rating .stars {
display: flex;
gap: 5px;
cursor: pointer;
}
#chat-rating .star {
font-size: 20px;
color: #ccc;
}
#chat-rating .star.filled {
color: var(--primary-chat-ai-color);
}
#chat-rating textarea {
width: 100%;
resize: vertical;
}
#chat-thank {
padding: 10px;
text-align: center;
display: none;
}
@keyframes chat-ai-bounce {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-12px); }
}
#chat-toggle.chat-move {
animation: chat-ai-bounce 0.6s ease-in-out 5;
}
#chat-powered-by {
text-align: center;
font-size: 10px;
margin: 4px;
color: #aaa;
}
#chat-powered-by a {
color: inherit;
text-decoration: none;
}
#chat-trigger-bubble {
position: fixed;
background: #fff;
border: 1px solid #ccc;
border-radius: 10px;
padding: 8px 12px;
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
max-width: 300px;
z-index: 1000;
font-family: var(--chat-ai-font-family);
font-size: var(--chat-ai-font-size);
}
#chat-trigger-bubble.arrow-right::before,
#chat-trigger-bubble.arrow-right::after,
#chat-trigger-bubble.arrow-left::before,
#chat-trigger-bubble.arrow-left::after {
content: '';
position: absolute;
top: var(--chat-trigger-arrow-top, 50%);
transform: translateY(-50%);
border-style: solid;
}
#chat-trigger-bubble.arrow-right::before {
right: -10px;
border-width: 10px 0 10px 10px;
border-color: transparent transparent transparent #ccc;
}
#chat-trigger-bubble.arrow-right::after {
right: -9px;
border-width: 9px 0 9px 9px;
border-color: transparent transparent transparent #fff;
}
#chat-trigger-bubble.arrow-left::before {
left: -10px;
border-width: 10px 10px 10px 0;
border-color: transparent #ccc transparent transparent;
}
#chat-trigger-bubble.arrow-left::after {
left: -9px;
border-width: 9px 9px 9px 0;
border-color: transparent #fff transparent transparent;
}
#chat-trigger-bubble .chat-trigger-close {
position: absolute;
top: 4px;
right: 6px;
cursor: pointer;
font-weight: bold;
}
@media (max-width: 600px) {
#chat-window {
width: calc(100vw - 40px);
max-height: calc(100vh - 100px);
max-height: calc(100dvh - 100px);
}
#chat-messages {
min-height: 0;
height: calc(100vh - 200px);
height: calc(100dvh - 200px);
}
}:root {
--se-black: #000000;
--se-white: #ffffff;
--se-green: #8B8F5D;
--se-orange: #E56C27;
--se-grey: #454343;
}
.author-profile-card {
display: flex;
flex-direction: column;
align-items: center;
gap: 16px;
border-top: 1px solid var(--se-green);
padding-top: 24px;
margin: auto;
width: 100%;
color: black;
.author-profile-card-content {
display: flex;
flex-direction: column;
gap: 10px;
width: 100%;
}
.flex-content {
display: flex;
align-items: center;
justify-content: space-between;
}
p {
margin: 0;
}
.profile-avatar {
border-radius: 9999px;
max-width: 100px;
}
.profile-bio {
font-weight: 400;
}
.profile-name {
font-size: 20px;
font-weight: 700;
}
.social-links {
display: flex;
gap: 10px;
}
svg {
fill: var(--se-green);
}
}
.se-summary,
.se-summary-category {
max-width: 420px;
width: 300px;
.se-summary__link {
color: var(--se-dark-grey);
font-weight: 400;
font-size: 16px;
text-decoration: none;
}
.se-summary__item {
&.active {
.se-summary__link {
display: flex;
font-weight: 700;
gap: 10px;
&::before {
content: "";
display: block;
width: 6px;
background-color: var(--se-green);
}
}
}
}
.se-summary__list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 24px;
}
.se-summary__title {
font-weight: 700;
color: var(--se-black);
font-size: 24px;
margin: 0;
margin-bottom: 24px;
}
}
@media (min-width: 768px) {
.author-profile-card {
flex-direction: row;
justify-content: space-between;
}
}
@media (min-width: 1024px) {}
@media (min-width: 1280px) {}
@media (min-width: 1536px) {}.cmplz-video.cmplz-iframe-styles{background-color:transparent}.cmplz-video.cmplz-hidden{visibility:hidden !important}.cmplz-blocked-content-notice{display:none}.cmplz-placeholder-parent{height:inherit}.cmplz-optin .cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-optin .cmplz-wp-video .cmplz-blocked-content-notice,.cmplz-optout .cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-optout .cmplz-wp-video .cmplz-blocked-content-notice{display:block}.cmplz-blocked-content-container,.cmplz-wp-video{animation-name:cmplz-fadein;animation-duration:600ms;background:#FFF;border:0;border-radius:3px;box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15);display:flex;justify-content:center;align-items:center;background-repeat:no-repeat !important;background-size:cover !important;height:inherit;position:relative}.cmplz-blocked-content-container.gmw-map-cover,.cmplz-wp-video.gmw-map-cover{max-height:100%;position:absolute}.cmplz-blocked-content-container.cmplz-video-placeholder,.cmplz-wp-video.cmplz-video-placeholder{padding-bottom:initial}.cmplz-blocked-content-container iframe,.cmplz-wp-video iframe{visibility:hidden;max-height:100%;border:0 !important}.cmplz-blocked-content-container .cmplz-custom-accept-btn,.cmplz-wp-video .cmplz-custom-accept-btn{white-space:normal;text-transform:initial;cursor:pointer;position:absolute !important;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);max-width:200px;font-size:14px;padding:10px;background-color:rgba(0,0,0,0.5);color:#fff;text-align:center;z-index:98;line-height:23px}.cmplz-blocked-content-container .cmplz-custom-accept-btn:focus,.cmplz-wp-video .cmplz-custom-accept-btn:focus{border:1px dotted #cecece}.cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-wp-video .cmplz-blocked-content-notice{white-space:normal;text-transform:initial;position:absolute !important;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);max-width:300px;font-size:14px;padding:10px;background-color:rgba(0,0,0,0.5);color:#fff;text-align:center;z-index:98;line-height:23px}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-links,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-links{display:block;margin-bottom:10px}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-links a,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-links a{color:#fff}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-blocked-content-notice-body,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-blocked-content-notice-body{display:block}.cmplz-blocked-content-container div div{display:none}.cmplz-wp-video .cmplz-placeholder-element{width:100%;height:inherit}@keyframes cmplz-fadein{from{opacity:0}to{opacity:1}}