PluginProbe
WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services / 3.2.9
WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services v3.2.9
8.7.7 8.7.6 8.7.5 8.7.4 8.7.3 8.7.2 8.7.1 8.7.0 8.6.9 8.6.8 8.6.7 8.6.6 8.6.5 8.6.4 8.6.2 8.6.1 8.6.0 8.5.9 8.5.8 8.5.7 8.5.6 8.5.5 8.5.4 8.5.3 8.5.2 All 533 releases
← All changes | css/common-style.css +49 -697 8.7.63.2.9 View file →
@@ -139,17 +139,15 @@
139 139 width: 60px;
140 140 height: 60px;
141 141 border-radius: 50%;
142 142 margin-top: 10px;
143 - box-shadow: #767580 0px 4px 20px;
144 143 }
145 144
146 145 #wp-chatbot-ball .wp-chatbot-ball img {
147 - width: 56px !important;
148 - height: 56px !important;
146 + width: 60px !important;
147 + height: 60px !important;
149 148 display: block;
150 149 border-radius: 50%;
151 - margin: 2px ;
152 150 }
153 151
154 152 .wp-chatbot-ball-animator {
155 153 position: relative;
@@ -190,11 +188,9 @@
190 188 border: 3px solid transparent;
191 189 border-top-color: #FF00FF;
192 190 animation: spin 1.5s linear infinite;
193 191 }
194 -.wp-chatbot-footer div#wp-chatbot-editor-container {
195 - display: flex;
196 -}
192 +
197 193 @keyframes spin {
198 194 0% {
199 195 -webkit-transform: rotate(0deg);
200 196 -ms-transform: rotate(0deg);
@@ -222,9 +218,9 @@
222 218 .wp-chatbot-board-container {
223 219 display: none;
224 220 font-family: "quicksandregular", "Helvetica Neue", Helvetica, Aria;
225 221 height: auto;
226 - width: 370px;
222 + width: 310px;
227 223 position: relative;
228 224 box-sizing: border-box; /*margin-bottom: 10px;*/
229 225 }
230 226
@@ -232,17 +228,8 @@
232 228 display: inline-block;
233 229 vertical-align: top;
234 230 }
235 231
236 -/* Hide slimScroll when message content fits (slimScroll otherwise shows a ghost bar) */
237 -.slimScrollDiv.wpbot-no-scroll > .slimScrollBar,
238 -.slimScrollDiv.wpbot-no-scroll > .slimScrollRail {
239 - display: none !important;
240 - opacity: 0 !important;
241 - visibility: hidden !important;
242 - pointer-events: none !important;
243 -}
244 -
245 232 .wp-chatbot-header {
246 233 border-radius: 5px 5px 0 0;
247 234 margin: 0;
248 235 padding: 15px 15px;
@@ -256,8 +243,9 @@
256 243 padding: 0 !important;
257 244 }
258 245
259 246 .wp-chatbot-content {
247 + height: 400px;
260 248 position: relative;
261 249 padding: 15px;
262 250 box-sizing: border-box;
263 251 }
@@ -380,11 +368,10 @@
380 368 display: none;
381 369 }
382 370
383 371 #wp-chatbot-messages-container .wp-chatbot-avatar img, .wp-chatbot-agent-profile .wp-chatbot-widget-avatar img {
384 - width: 40px;
385 - height: 40px;
386 - object-fit: cover;
372 + width: 40px !important;
373 + height: 40px !important;
387 374 }
388 375
389 376 /*********************************************************************************
390 377 4. Tab
@@ -516,9 +503,8 @@
516 503 .wp-chatbot-editor-container {
517 504 border-radius: 0 0 5px 5px;
518 505 margin: 0;
519 506 padding: 4px 15px;
520 - position: relative;
521 507 }
522 508
523 509 .wp-chatbot-editor-container input {
524 510 display: inline-block;
@@ -540,8 +526,33 @@
540 526 box-shadow: none;
541 527 background: none;
542 528 }
543 529
530 +.wp-chatbot-editor-container button {
531 + display: inline-block;
532 + height: 40px;
533 + background: transparent url("../images/send-button.png") no-repeat center;
534 + color: transparent;
535 + width: 20%;
536 + cursor: pointer;
537 + margin: 0 0 0 -8px;
538 + padding: 0;
539 + border: none;
540 + outline: none;
541 +}
542 +
543 +.wp-chatbot-editor-container button:hover {
544 + background: transparent url("../images/send-button.png") no-repeat center;
545 + color: transparent;
546 +}
547 +
548 +.wp-chatbot-editor-container button:focus {
549 + outline: none;
550 + border: none;
551 + box-shadow: none;
552 + background: transparent url("../images/send-button.png") no-repeat center;
553 +}
554 +
544 555 /*****************************************************************************************
545 556 6. Message Item
546 557 *********************************************************************************************/
547 558 /*Load More Product*/
@@ -1147,21 +1158,17 @@
1147 1158
1148 1159 /************Link Item*************/
1149 1160 .wp-chatbot-shortcode-template-container span.qcld-chatbot-product-category, .wp-chatbot-shortcode-template-container span.qcld-chatbot-support-items, .wp-chatbot-shortcode-template-container span.qcld-chatbot-wildcard, .wp-chatbot-shortcode-template-container span.qcld-chatbot-suggest-email,span.qcld-chatbot-site-search,span.qcld-chatbot-suggest-phone, .wp-chatbot-shortcode-template-container span.qcld-chatbot-reset-btn, .wp-chatbot-shortcode-template-container #wp-chatbot-loadmore, span.qcld-chat-common {
1150 1161 color: #000000;
1162 + background-image: linear-gradient(to right, #a1c4fd 0%, #c2e9fb 51%, #a1c4fd 100%);
1151 1163 background-size: 200% auto;
1152 - background-color: #ffffff7d;
1164 + box-shadow: 0 5px 5px #c3c3c3;
1153 1165 border: 1px solid #ffffff;
1154 - display: inline-block;
1155 - margin: 3px auto;
1156 - padding: 6px 11px;
1157 - margin-right: 4px;
1158 1166 }
1159 1167
1160 1168 .wp-chatbot-shortcode-template-container span.qcld-chatbot-product-category:hover, .wp-chatbot-shortcode-template-container span.qcld-chatbot-support-items:hover, .wp-chatbot-shortcode-template-container span.qcld-chatbot-wildcard:hover, .wp-chatbot-shortcode-template-container span.qcld-chatbot-suggest-email:hover,span.qcld-chatbot-site-search:hover,span.qcld-chatbot-suggest-phone:hover, .wp-chatbot-shortcode-template-container span.qcld-chatbot-reset-btn:hover, .wp-chatbot-shortcode-template-container #wp-chatbot-loadmore:hover, span.qcld-chat-common:hover {
1161 1169 background-position: right center;
1162 1170 box-shadow: none;
1163 - background-color: #a1c4fd;
1164 1171 }
1165 1172
1166 1173 /****************************************************************************************************
1167 1174 10. Notification
@@ -1216,42 +1223,20 @@
1216 1223 .wp-chatbot-notification-message {
1217 1224 transition: opacity 0.5s;
1218 1225 }
1219 1226
1220 -div#wp-chatbot-desktop-reload {
1221 - background: transparent;
1222 - width: 30px;
1223 - height: 30px;
1224 - border-radius: 50%;
1225 - position: absolute;
1226 - top: -21px;
1227 - right: 25px;
1228 - color: #ffffff;
1229 - cursor: pointer;
1230 - text-align: center;
1231 - box-sizing: border-box;
1232 - transition: 0.2s;
1233 - transform: translateY(20px);
1234 -}
1235 -div#wp-chatbot-desktop-close span{
1236 - position: relative;
1237 -}
1238 -div#wp-chatbot-desktop-reload span {
1239 - position: relative;
1240 - top: 6px;
1241 -}
1242 1227 #wp-chatbot-desktop-close {
1243 -display: block;
1228 + display: block;
1244 1229 position: absolute;
1245 - right: 3px;
1230 + right: -5px;
1246 1231 padding: 5px;
1247 1232 font-size: 14px;
1248 1233 font-family: "Arial";
1249 1234 line-height: 20px;
1250 - top: -20px;
1235 + top: -30px;
1251 1236 width: 30px;
1252 1237 height: 30px;
1253 - background-color: transparent;
1238 + background-color: #7d8999;
1254 1239 border-radius: 50%;
1255 1240 color: #ffffff;
1256 1241 cursor: pointer;
1257 1242 text-align: center;
@@ -1259,19 +1244,8 @@
1259 1244 transition: 0.2s;
1260 1245 transform: translateY(20px);
1261 1246 }
1262 1247
1263 -span.chatbot_intent_reload {
1264 - position: absolute;
1265 - left: 80%;
1266 - -webkit-transform: translate(-80%, -50%);
1267 - transform: translate(-80%, -50%);
1268 - top: 50%;
1269 - color: #9a9a9a;
1270 - cursor: pointer;
1271 - line-height: normal;
1272 - }
1273 -
1274 1248 .wp-chatbot-notification-close {
1275 1249 display: block;
1276 1250 position: absolute;
1277 1251 right: 0;
@@ -1300,11 +1274,9 @@
1300 1274 .wp-chatbot-notification-container:hover .wp-chatbot-notification-close {
1301 1275 visibility: visible;
1302 1276 transform: translateY(0px);
1303 1277 }
1304 -ul.wp-chatbot-messages-container > li > .wp-chatbot-paragraph{
1305 - display: block !important;
1306 -}
1278 +
1307 1279 .wp-chatbot-ball-cart-items {
1308 1280 bottom: -8px;
1309 1281 left: -11px;
1310 1282 position: absolute;
@@ -1370,11 +1342,9 @@
1370 1342 background-position: 0 -80px;
1371 1343 border: none !important;
1372 1344 box-shadow: none !important;
1373 1345 }
1374 -.swal2-container {
1375 - z-index: 99999999;
1376 -}
1346 +
1377 1347 .facebook-messenger {
1378 1348 background-position: 0 -80px;
1379 1349 }
1380 1350
@@ -1410,112 +1380,8 @@
1410 1380 .fb_dialog > .fb_dialog_content {
1411 1381 opacity: 0.01;
1412 1382 }
1413 1383
1414 -
1415 -
1416 -
1417 -/**********************************************************************************************
1418 -**********************************************************************************************
1419 -************************************* text writing animation ************************************
1420 -***********************************************************************************************
1421 -***********************************************************************************************/
1422 -/* @keyframes letters {
1423 - from {
1424 - left: 0;
1425 - }
1426 - to {
1427 - left: 100%;
1428 - }
1429 - }
1430 - @keyframes lines {
1431 - from {
1432 - top: 0;
1433 - }
1434 - to {
1435 - top: 100%;
1436 - }
1437 - }
1438 - @keyframes cursor-type {
1439 - 50% {
1440 - border-color: #1f8ceb00;
1441 - }
1442 - }
1443 - @keyframes cursor-wait {
1444 - 0% {
1445 - box-shadow: inset 2px 0 0 0 rgba(0, 0, 0, 0);
1446 - }
1447 - 1% {
1448 - box-shadow: inset 2px 0 0 0 #1f8ceb00;
1449 - }
1450 - 40% {
1451 - box-shadow: inset 2px 0 0 0 #1f8ceb00;
1452 - }
1453 - }
1454 -
1455 -
1456 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation {
1457 - position: relative;
1458 - width: 100%;
1459 - line-height: 1.2;
1460 - word-break: break-all;
1461 - overflow: hidden;
1462 - }
1463 - @supports (width: 1ch) {
1464 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:before, li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:after {
1465 - box-sizing: border-box;
1466 - content: "";
1467 - position: absolute;
1468 - z-index: 1;
1469 - display: block;
1470 - height: 1.2em;
1471 - width: 100%;
1472 - background-color: #1f8ceb;
1473 - }
1474 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:before {
1475 - border-left: 2px solid transparent;
1476 - top: 100%;
1477 - animation-name: letters, lines, cursor-type, cursor-wait;
1478 - animation-fill-mode: both, both, both, backwards;
1479 - }
1480 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:after {
1481 - content: "";
1482 - height: 100%;
1483 - top: 100%;
1484 - left: 0;
1485 - margin-top: 1.2em;
1486 - }
1487 - }
1488 -
1489 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:before {
1490 - animation-duration: 1.4285714286s, 1.4285714286s, 0.0285714286s, 0.8s;
1491 - animation-timing-function: steps(50, end), steps(1, end), step-end, ease-out;
1492 - animation-iteration-count: 1, 1, 35, 2;
1493 - animation-delay: 0.6s, 0.6s, 0.6s, 1.0s;
1494 - }
1495 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:after {
1496 - animation: lines 1.4285714286s steps(1, end) 1;
1497 - animation-fill-mode: backwards;
1498 - animation-delay: 1.0s;
1499 - }
1500 -
1501 -
1502 - ul.wp-chatbot-messages-container > li.wp-chatbot-msg:first-child{
1503 - background-color: #fff;
1504 - }
1505 -
1506 -
1507 - ul.wp-chatbot-messages-container > li.wp-chatbot-msg:first-child .wp-chatbot-paragraph .wp-chatbot-textanimation:before, ul.wp-chatbot-messages-container > li.wp-chatbot-msg:first-child .wp-chatbot-paragraph .wp-chatbot-textanimation:after {
1508 - box-sizing: border-box;
1509 - content: "";
1510 - position: absolute;
1511 - z-index: 1;
1512 - display: block;
1513 - height: 1.2em;
1514 - width: 100%;
1515 - background-color: #1f8ceb00;
1516 - } */
1517 -
1518 1384 /****************************************************************************************************
1519 1385 11 Responsive
1520 1386 ****************************************************************************************************/
1521 1387 @media screen and (max-width: 1200px) {
@@ -1558,23 +1424,18 @@
1558 1424 }
1559 1425
1560 1426 }
1561 1427
1562 -
1563 1428 @media screen and (max-width: 767px) {
1564 - body div#wp-chatbot-ball-container {
1565 - max-width: 98%;
1566 - margin: 0 auto 3px auto;
1567 - }
1568 1429 .wp-chatbot-header {
1569 1430 padding-left: 50px;
1570 1431 padding-right: 50px;
1571 1432 }
1572 1433
1573 - .wp-chatbot-board-container{
1574 - width: 310px;
1434 + .wp-chatbot-board-container {
1435 + width: 100%;
1575 1436 }
1576 -
1437 +
1577 1438 #wp-chatbot-mobile-close {
1578 1439 position: absolute;
1579 1440 right: 12px;
1580 1441 top: 9px;
@@ -1584,11 +1445,8 @@
1584 1445 height: 30px;
1585 1446 cursor: pointer;
1586 1447 color: transparent;
1587 1448 }
1588 - #wp-chatbot-mobile-close{
1589 - display: none;
1590 - }
1591 1449
1592 1450
1593 1451
1594 1452 .wp-chatbot-notification-close {
@@ -1613,9 +1471,9 @@
1613 1471 display: inline-block !important;
1614 1472 }
1615 1473
1616 1474 .wp-chatbot-header {
1617 - padding-top: 15px;
1475 + padding-top: 50px;
1618 1476 }
1619 1477
1620 1478 #wp-chatbot-chat-container {
1621 1479 right: 30px;
@@ -1634,517 +1492,11 @@
1634 1492 .wp-chatbot-notification-container {
1635 1493 width: 250px;
1636 1494 padding-top: 55px;
1637 1495 }
1638 - .wp-chatbot-mobile-full-screen .wp-chatbot-header{
1639 - padding-top: 15px !important;
1640 - }
1641 1496 }
1642 -.wpb-search-result a{
1643 - display: block;
1497 +.wpb-search-result{}
1498 +.wpb-search-result p{}
1499 +.wpb-search-result a{display: block;
1644 1500 background: #fff;
1645 - margin-bottom: 0;
1646 - padding: 5px;
1647 -}
1648 -@media screen and (-webkit-min-device-pixel-ratio:0) {
1649 - .qcwp-chatbot-search-article input:focus,
1650 - .qcwp-chatbot-search-article input {
1651 - font-size: 14px;
1652 - }
1653 -
1654 - input#wp-chatbot-editor:focus,
1655 - input#wp-chatbot-editor {
1656 - font-size: 14px;
1657 - }
1658 -
1659 - }
1660 -/*modal form*/
1661 -.plugin-card{
1662 - width: 77% !important;
1663 - height: 186px;
1664 -}
1665 -.plugin-action-buttons li a{
1666 - font-size: 13px;
1667 -}
1668 -.name a{
1669 - text-decoration: none !important;
1670 -}
1671 -
1672 -.cxsc-settings-blocks-addon {
1673 - width: 100% !important;
1674 - }
1675 - .plugin-card {
1676 - width: 100% !important;
1677 - }
1678 - span.chatbotquote-info {
1679 - font-size: 38px;
1680 - padding: 20px 0 0 0;
1681 - position: absolute;
1682 - left: 0;
1683 - top: 32px;
1684 -}
1685 -.wp-chatbot-textanimation {
1686 - position: relative;
1687 -}
1688 -ul.wp-chatbot-messages-container > li > .wp-chatbot-paragraph .wp-chatbot-textanimation h3 {
1689 - padding: 0 0 0 22px !important;
1690 -}
1691 -span.chatbotquote-info-foot {
1692 - font-size: 38px;
1693 - padding: 0px 0 0 130px;
1694 - position: static;
1695 - bottom: -20px;
1696 - display: grid;
1697 - line-height: 0;
1698 -}
1699 -wp-chatbot-editor-container input::placeholder {
1700 - color: #181818 !important;
1701 -}
1702 -.wp-chatbot-editor-container input::-ms-input-placeholder {
1703 - color: #181818 !important;
1704 -}
1705 -.wpb-search-result a {
1706 - display: block;
1707 - background: #eeeeee00 !important;
1708 - padding: 4px 5px;
1709 - line-height: 20px;
1710 - padding-left: 0px !important;
1711 - margin-bottom: 0;
1712 - color: #222 !important;
1713 -}
1714 -.wpb-search-result a p {
1715 - margin-bottom: 0;
1716 -}
1717 -.wpb-search-result a {
1718 - color: #222;
1719 -}
1720 -.wpbot_card_caption p {
1721 - color: #222;
1722 -}
1723 -
1724 -
1725 -.wp-chatbot-textanimation ul {
1726 - margin: 12px 0 8px 20px !important;
1727 -}
1728 -.wp-chatbot-textanimation ul li {
1729 - list-style-type: "✓";
1730 - padding-left: 6px;
1731 -}
1732 -
1733 -.wp-chatbot-textanimation ul li::marker {
1734 - color: #1d73b4;
1735 - font-weight: bold;
1736 -}
1737 -
1738 -/** like dislike thumbs icons**/
1739 -
1740 -
1741 -
1742 -.qcld-like-dislike-icon {
1743 - display: none;
1744 -}
1745 -
1746 -.qcld-like-dislike-icon a {
1747 - padding: 0 5px;
1748 -}
1749 -
1750 -.qcld-like-dislike-icon i {
1751 - color: #1d73b4;
1752 -}
1753 -
1754 -ul.wp-chatbot-messages-container>li>.wp-chatbot-paragraph,
1755 -.wp-chatbot-agent-profile .wp-chatbot-bubble {
1756 - padding: 8px 15px 15px 15px;
1757 -}
1758 -
1759 -/* ul.wp-chatbot-messages-container>li.wp-chatbot-msg:hover .qcld-like-dislike-icon {
1760 - opacity: 1;
1761 -} */
1762 -.qcld-share {
1763 - position: relative;
1764 - display: inline-block;
1765 -}
1766 -
1767 -.qcld-share .share-menu {
1768 - position: absolute;
1769 - bottom: 100%;
1770 - left: -6px;
1771 - background: #fff;
1772 - border: 1px solid #ddd;
1773 - padding: 5px;
1774 - display: flex;
1775 - gap: 8px;
1776 - border-radius: 5px;
1777 -}
1778 -
1779 -.qcld-share .share-menu a {
1780 - color: #333;
1781 - font-size: 16px;
1782 -}
1783 -
1784 -/**Modal style**/
1785 -#wpbot-report-modal>div {
1786 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%) !important;
1787 - background: #1d73b4 !important;
1788 - backdrop-filter: blur(0px);
1789 - isolation: isolate;
1790 -}
1791 -
1792 -#wpbot-report-modal input#wpbot-report-email {
1793 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1794 - background: #ffffff61;
1795 - backdrop-filter: blur(0px);
1796 - isolation: isolate;
1797 - margin: 0 0;
1798 - border-radius: 6PX;
1799 - padding: 10px 10px;
1800 - border: none;
1801 - width: 96% !important;
1802 - color: #fff;
1803 -}
1804 -
1805 -#wpbot-report-modal textarea#wpbot-report-text {
1806 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1807 - background: #ffffff61;
1808 - backdrop-filter: blur(0px);
1809 - isolation: isolate;
1810 - margin: 0 0;
1811 - border-radius: 6PX;
1812 - padding: 10px 10px;
1813 - border: none;
1814 - width: 96% !important;
1815 - color: #fff;
1816 -}
1817 -
1818 -#wpbot-report-modal textarea#wpbot-report-text:focus-visible {
1819 - box-shadow: none;
1820 - outline: none;
1821 -}
1822 -
1823 -#wpbot-report-modal input#wpbot-report-email:focus-visible {
1824 - box-shadow: none;
1825 - outline: none;
1826 -}
1827 -
1828 -#wpbot-report-modal>div h3 {
1829 - font-size: 20px;
1830 - font-weight: bold;
1831 - color: #fff;
1832 -}
1833 -
1834 -#wpbot-report-modal>div label {
1835 - font-size: 16px;
1836 - font-weight: bold;
1837 - color: #fff;
1838 -}
1839 -
1840 -#wpbot-report-modal>div button {
1841 - transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
1842 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1843 - background: rgb(255 255 255 / 25%);
1844 - backdrop-filter: none;
1845 - isolation: isolate;
1846 - color: rgb(29 115 180) !important;
1847 - margin: 2px 2px;
1848 - border: 1px solid #fff !important;
1849 - padding: 8px 15px;
1850 - border-radius: 8px;
1851 - color: #ffffff !important;
1852 - font-size: 14px;
1853 - font-weight: bold;
1854 - cursor: pointer;
1855 -}
1856 -
1857 -#wpbot-report-modal>div button:hover {
1858 - transform: scale(0.95);
1859 -}
1860 -
1861 -.qcld-like-dislike-icon a .liked {
1862 - color: green;
1863 - cursor: default;
1864 - pointer-events: none;
1865 -}
1866 -
1867 -.qcld-like-dislike-icon a .disliked {
1868 - color: red;
1869 - cursor: default;
1870 - pointer-events: none;
1871 -}
1872 -
1873 -ul.wp-chatbot-messages-container>li.wp-chatbot-msg .chat-container .wp-chatbot-paragraph {
1874 - box-shadow: none;
1875 - background: transparent;
1876 - backdrop-filter: none;
1877 - isolation: inherit;
1878 -}
1879 -
1880 -
1881 -
1882 -ul.wp-chatbot-messages-container>li.wp-chatbot-msg .chat-container {
1883 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1884 - background: rgb(255 255 255 / 30%);
1885 - backdrop-filter: blur(0px);
1886 - isolation: isolate;
1887 - border-radius: 10px;
1888 - padding: 8px 15px;
1889 -}
1890 -
1891 -.qcld-like-dislike-icon {
1892 - padding: 6px 0 0 0;
1893 - margin-top: 20px;
1894 -}
1895 -
1896 -
1897 -
1898 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-up.liked {
1899 - position: relative;
1900 - font-size: 0px !important;
1901 -}
1902 -
1903 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-up.liked:before {
1904 - content: "\f164" !important;
1905 - left: 0px;
1906 - bottom: 0;
1907 - font-size: 16px !important;
1908 -}
1909 -
1910 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-down.disliked {
1911 - position: relative;
1912 - font-size: 0px !important;
1913 -}
1914 -
1915 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-down.disliked:before {
1916 - content: "\f165" !important;
1917 - left: 0px;
1918 - bottom: 0;
1919 - font-size: 16px !important;
1920 -}
1921 -
1922 -.qcld-like-dislike-icon a {
1923 - padding: 0 0px;
1924 -}
1925 -
1926 -.qcld-like-dislike-icon a i {
1927 - transition: all 0.2s ease-in-out;
1928 -}
1929 -
1930 -.qcld-like-dislike-icon a i:hover {
1931 - transform: scale(1.5);
1932 -}
1933 -
1934 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-up.liked:before {
1935 - transition: all 0.2s ease-in-out;
1936 -}
1937 -
1938 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-down.disliked:before:hover {
1939 - transform: scale(1.5);
1940 -}
1941 -
1942 -.qcld-like-dislike-icon a {
1943 - outline: none !important;
1944 -}
1945 -
1946 -
1947 -.qcld-like-dislike-icon a {
1948 - padding: 0 10px 0 0;
1949 -}
1950 -
1951 -.qcld-like-dislike-icon .share-menu a {
1952 - padding: 0 0 0 0 !important;
1953 -}
1954 -
1955 -.qcld-like-dislike-icon i {
1956 - color: #ffffff;
1957 -}
1958 -
1959 -.wp-chatbot-textanimation ul {
1960 - margin: 12px 0 8px 20px !important;
1961 - padding: 0;
1962 -}
1963 -.qcld-like-dislike-icon i {
1964 - color: #1e74b3;
1965 -}
1966 -.qcld-like-dislike-icon a i {
1967 - font-size: 16px;
1968 - padding: 0;
1969 - height: auto;
1970 -}
1971 -.qcld-like-dislike-icon a {
1972 - padding: 0 5px 0 0;
1973 - height: 15px;
1974 -}
1975 -
1976 -
1977 -/* Icon video / YouTube inside the floating ball */
1978 -#wp-chatbot-ball .wp-chatbot-ball .wpbot-icon-video,
1979 -.wp-chatbot-ball .wpbot-icon-video {
1980 - position: absolute;
1981 - top: 0;
1982 - left: 0;
1983 - width: 100% !important;
1984 - height: 100% !important;
1985 - border-radius: 50%;
1986 - object-fit: cover;
1987 - pointer-events: none;
1988 - box-sizing: border-box;
1989 - z-index: 0;
1990 -}
1991 -
1992 -/*
1993 - * YouTube iframes ignore object-fit and letterbox in a square ball.
1994 - * Size as 16:9 cover, then scale up so title / logo / chrome are cropped by the circle.
1995 - */
1996 -#wp-chatbot-ball .wp-chatbot-ball iframe.wpbot-icon-video,
1997 -.wp-chatbot-ball iframe.wpbot-icon-video {
1998 - top: 50%;
1999 - left: 50%;
2000 - width: 100% !important; /* 16 / 9 */
2001 - height: 100% !important;
2002 - min-height: 100%;
2003 - border: 0;
2004 - transform: translate(-50%, -50%) scale(1);
2005 - transform-origin: center center;
2006 - object-fit: unset;
2007 - pointer-events: none;
2008 -}
2009 -
2010 -.wp-chatbot-ball-animator {
2011 - position: relative;
2012 - border-radius: 50%;
2013 - z-index: 1;
2014 -}
2015 -
2016 -.wp-chatbot-animation-active .wp-chatbot-ball-animation-switch {
2017 - opacity: 1;
2018 - width: 100%;
2019 - height: 100%;
2020 - position: absolute;
2021 - animation: spin 2s linear infinite;
2022 - border: 3px solid transparent;
2023 - border-top-color: #9370DB;
2024 -}
2025 -
2026 -.wp-chatbot-animation-active .wp-chatbot-ball-animation-switch:before {
2027 - content: "";
2028 - position: absolute;
2029 - top: -9px;
2030 - left: -9px;
2031 - right: -9px;
2032 - bottom: -9px;
2033 - border-radius: 50%;
2034 - border: 3px solid transparent;
2035 - border-top-color: #BA55D3;
2036 - animation: spin 3s linear infinite;
2037 -}
2038 -
2039 -.wp-chatbot-animation-active .wp-chatbot-ball-animation-switch:after {
2040 - content: "";
2041 - position: absolute;
2042 - top: -15px;
2043 - left: -15px;
2044 - right: -15px;
2045 - bottom: -15px;
2046 - border-radius: 50%;
2047 - border: 3px solid transparent;
2048 - border-top-color: #FF00FF;
2049 - animation: spin 1.5s linear infinite;
2050 -}
2051 -
2052 -@keyframes spin {
2053 - 0% {
2054 - -webkit-transform: rotate(0deg);
2055 - -ms-transform: rotate(0deg);
2056 - transform: rotate(0deg);
2057 - }
2058 -
2059 - 100% {
2060 - -webkit-transform: rotate(360deg);
2061 - -ms-transform: rotate(360deg);
2062 - transform: rotate(360deg);
2063 - }
2064 -}
2065 -
2066 -@keyframes spinHide {
2067 - 0% {
2068 - opacity: 0;
2069 - }
2070 -
2071 - 100% {
2072 - opacity: 0;
2073 - }
2074 -}
2075 -
2076 -span.qcld-chatbot-wildcard.qcld_back_to_start {
2077 - text-align: center;
2078 - margin: 0 auto;
2079 - display: block;
2080 - max-width: 120px;
2081 -}
2082 -.chat-container.wp-chatbot-msg-flat:has(.qcld_back_to_start) {
2083 - box-shadow: none !important;
2084 - background: rgb(255 255 255 / 0%) !important;
2085 -}
2086 -
2087 -@media screen and (min-height: 1281px) {
2088 - div#wp-chatbot-chat-container .slimScrollDiv {
2089 - height: 100vh !important;
2090 - max-height: 680px !important;
2091 - }
2092 - div#wp-chatbot-chat-container div#wp-chatbot-board-container {
2093 - height: 100vh !important;
2094 - max-height: 850px !important;
2095 - }
2096 -}
2097 -
2098 -@media screen and (max-width: 1024px) {
2099 - div#wp-chatbot-chat-container {
2100 - right: 30px !important;
2101 - bottom: 30px !important;
2102 - left: auto !important;
2103 - }
2104 - div#wp-chatbot-mobile-close {
2105 - display: none;
2106 - }
2107 -}
2108 -@media screen and (max-width: 767px) {
2109 - body div#wp-chatbot-ball-container {
2110 - max-width: 100%;
2111 - margin: 0 auto 3px auto;
2112 - width: 100%;
2113 - }
2114 -}
2115 -
2116 -@media screen and (max-width: 480px) {
2117 - div#wp-chatbot-chat-container {
2118 - right: 0px !important;
2119 - bottom: 0px !important;
2120 - left: auto !important;
2121 - }
2122 - /* Full width only below 480px while open (incl. after reset/reload) */
2123 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open {
2124 - left: 0 !important;
2125 - right: 0 !important;
2126 - bottom: 0 !important;
2127 - width: 100% !important;
2128 - max-width: 100% !important;
2129 - }
2130 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2131 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open .wp-chatbot-board-container,
2132 - .wp-chatbot-template-01 div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2133 - .wp-chatbot-mobile-full-screen.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2134 - .wp-chatbot-template-01 .wp-chatbot-mobile-full-screen.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2135 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open .slimScrollDiv,
2136 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open .wp-chatbot-ball-inner {
2137 - width: 100% !important;
2138 - max-width: 100% !important;
2139 - }
2140 - div#wp-chatbot-ball {
2141 - right: 30px;
2142 - bottom: 30px;
2143 - position: relative;
2144 -}
2145 -}
2146 -@media screen and (min-height: 1281px) {
2147 - body .wp-chatbot-ball-inner.wp-chatbot-content {
2148 - height: 660px !important; max-height: 660px !important;
2149 - }
2150 -}
1501 + margin-bottom: 7px;
1502 + padding: 5px;}