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 -676 8.7.03.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
@@ -247,8 +243,9 @@
247 243 padding: 0 !important;
248 244 }
249 245
250 246 .wp-chatbot-content {
247 + height: 400px;
251 248 position: relative;
252 249 padding: 15px;
253 250 box-sizing: border-box;
254 251 }
@@ -371,11 +368,10 @@
371 368 display: none;
372 369 }
373 370
374 371 #wp-chatbot-messages-container .wp-chatbot-avatar img, .wp-chatbot-agent-profile .wp-chatbot-widget-avatar img {
375 - width: 40px;
376 - height: 40px;
377 - object-fit: cover;
372 + width: 40px !important;
373 + height: 40px !important;
378 374 }
379 375
380 376 /*********************************************************************************
381 377 4. Tab
@@ -507,9 +503,8 @@
507 503 .wp-chatbot-editor-container {
508 504 border-radius: 0 0 5px 5px;
509 505 margin: 0;
510 506 padding: 4px 15px;
511 - position: relative;
512 507 }
513 508
514 509 .wp-chatbot-editor-container input {
515 510 display: inline-block;
@@ -531,8 +526,33 @@
531 526 box-shadow: none;
532 527 background: none;
533 528 }
534 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 +
535 555 /*****************************************************************************************
536 556 6. Message Item
537 557 *********************************************************************************************/
538 558 /*Load More Product*/
@@ -1138,21 +1158,17 @@
1138 1158
1139 1159 /************Link Item*************/
1140 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 {
1141 1161 color: #000000;
1162 + background-image: linear-gradient(to right, #a1c4fd 0%, #c2e9fb 51%, #a1c4fd 100%);
1142 1163 background-size: 200% auto;
1143 - background-color: #ffffff7d;
1164 + box-shadow: 0 5px 5px #c3c3c3;
1144 1165 border: 1px solid #ffffff;
1145 - display: inline-block;
1146 - margin: 3px auto;
1147 - padding: 6px 11px;
1148 - margin-right: 4px;
1149 1166 }
1150 1167
1151 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 {
1152 1169 background-position: right center;
1153 1170 box-shadow: none;
1154 - background-color: #a1c4fd;
1155 1171 }
1156 1172
1157 1173 /****************************************************************************************************
1158 1174 10. Notification
@@ -1207,42 +1223,20 @@
1207 1223 .wp-chatbot-notification-message {
1208 1224 transition: opacity 0.5s;
1209 1225 }
1210 1226
1211 -div#wp-chatbot-desktop-reload {
1212 - background: transparent;
1213 - width: 30px;
1214 - height: 30px;
1215 - border-radius: 50%;
1216 - position: absolute;
1217 - top: -21px;
1218 - right: 25px;
1219 - color: #ffffff;
1220 - cursor: pointer;
1221 - text-align: center;
1222 - box-sizing: border-box;
1223 - transition: 0.2s;
1224 - transform: translateY(20px);
1225 -}
1226 -div#wp-chatbot-desktop-close span{
1227 - position: relative;
1228 -}
1229 -div#wp-chatbot-desktop-reload span {
1230 - position: relative;
1231 - top: 6px;
1232 -}
1233 1227 #wp-chatbot-desktop-close {
1234 -display: block;
1228 + display: block;
1235 1229 position: absolute;
1236 - right: 3px;
1230 + right: -5px;
1237 1231 padding: 5px;
1238 1232 font-size: 14px;
1239 1233 font-family: "Arial";
1240 1234 line-height: 20px;
1241 - top: -20px;
1235 + top: -30px;
1242 1236 width: 30px;
1243 1237 height: 30px;
1244 - background-color: transparent;
1238 + background-color: #7d8999;
1245 1239 border-radius: 50%;
1246 1240 color: #ffffff;
1247 1241 cursor: pointer;
1248 1242 text-align: center;
@@ -1250,19 +1244,8 @@
1250 1244 transition: 0.2s;
1251 1245 transform: translateY(20px);
1252 1246 }
1253 1247
1254 -span.chatbot_intent_reload {
1255 - position: absolute;
1256 - left: 80%;
1257 - -webkit-transform: translate(-80%, -50%);
1258 - transform: translate(-80%, -50%);
1259 - top: 50%;
1260 - color: #9a9a9a;
1261 - cursor: pointer;
1262 - line-height: normal;
1263 - }
1264 -
1265 1248 .wp-chatbot-notification-close {
1266 1249 display: block;
1267 1250 position: absolute;
1268 1251 right: 0;
@@ -1291,11 +1274,9 @@
1291 1274 .wp-chatbot-notification-container:hover .wp-chatbot-notification-close {
1292 1275 visibility: visible;
1293 1276 transform: translateY(0px);
1294 1277 }
1295 -ul.wp-chatbot-messages-container > li > .wp-chatbot-paragraph{
1296 - display: block !important;
1297 -}
1278 +
1298 1279 .wp-chatbot-ball-cart-items {
1299 1280 bottom: -8px;
1300 1281 left: -11px;
1301 1282 position: absolute;
@@ -1361,11 +1342,9 @@
1361 1342 background-position: 0 -80px;
1362 1343 border: none !important;
1363 1344 box-shadow: none !important;
1364 1345 }
1365 -.swal2-container {
1366 - z-index: 99999999;
1367 -}
1346 +
1368 1347 .facebook-messenger {
1369 1348 background-position: 0 -80px;
1370 1349 }
1371 1350
@@ -1401,112 +1380,8 @@
1401 1380 .fb_dialog > .fb_dialog_content {
1402 1381 opacity: 0.01;
1403 1382 }
1404 1383
1405 -
1406 -
1407 -
1408 -/**********************************************************************************************
1409 -**********************************************************************************************
1410 -************************************* text writing animation ************************************
1411 -***********************************************************************************************
1412 -***********************************************************************************************/
1413 -/* @keyframes letters {
1414 - from {
1415 - left: 0;
1416 - }
1417 - to {
1418 - left: 100%;
1419 - }
1420 - }
1421 - @keyframes lines {
1422 - from {
1423 - top: 0;
1424 - }
1425 - to {
1426 - top: 100%;
1427 - }
1428 - }
1429 - @keyframes cursor-type {
1430 - 50% {
1431 - border-color: #1f8ceb00;
1432 - }
1433 - }
1434 - @keyframes cursor-wait {
1435 - 0% {
1436 - box-shadow: inset 2px 0 0 0 rgba(0, 0, 0, 0);
1437 - }
1438 - 1% {
1439 - box-shadow: inset 2px 0 0 0 #1f8ceb00;
1440 - }
1441 - 40% {
1442 - box-shadow: inset 2px 0 0 0 #1f8ceb00;
1443 - }
1444 - }
1445 -
1446 -
1447 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation {
1448 - position: relative;
1449 - width: 100%;
1450 - line-height: 1.2;
1451 - word-break: break-all;
1452 - overflow: hidden;
1453 - }
1454 - @supports (width: 1ch) {
1455 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:before, li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:after {
1456 - box-sizing: border-box;
1457 - content: "";
1458 - position: absolute;
1459 - z-index: 1;
1460 - display: block;
1461 - height: 1.2em;
1462 - width: 100%;
1463 - background-color: #1f8ceb;
1464 - }
1465 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:before {
1466 - border-left: 2px solid transparent;
1467 - top: 100%;
1468 - animation-name: letters, lines, cursor-type, cursor-wait;
1469 - animation-fill-mode: both, both, both, backwards;
1470 - }
1471 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:after {
1472 - content: "";
1473 - height: 100%;
1474 - top: 100%;
1475 - left: 0;
1476 - margin-top: 1.2em;
1477 - }
1478 - }
1479 -
1480 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:before {
1481 - animation-duration: 1.4285714286s, 1.4285714286s, 0.0285714286s, 0.8s;
1482 - animation-timing-function: steps(50, end), steps(1, end), step-end, ease-out;
1483 - animation-iteration-count: 1, 1, 35, 2;
1484 - animation-delay: 0.6s, 0.6s, 0.6s, 1.0s;
1485 - }
1486 - li.wp-chatbot-msg .wp-chatbot-paragraph .wp-chatbot-textanimation:after {
1487 - animation: lines 1.4285714286s steps(1, end) 1;
1488 - animation-fill-mode: backwards;
1489 - animation-delay: 1.0s;
1490 - }
1491 -
1492 -
1493 - ul.wp-chatbot-messages-container > li.wp-chatbot-msg:first-child{
1494 - background-color: #fff;
1495 - }
1496 -
1497 -
1498 - 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 {
1499 - box-sizing: border-box;
1500 - content: "";
1501 - position: absolute;
1502 - z-index: 1;
1503 - display: block;
1504 - height: 1.2em;
1505 - width: 100%;
1506 - background-color: #1f8ceb00;
1507 - } */
1508 -
1509 1384 /****************************************************************************************************
1510 1385 11 Responsive
1511 1386 ****************************************************************************************************/
1512 1387 @media screen and (max-width: 1200px) {
@@ -1549,23 +1424,18 @@
1549 1424 }
1550 1425
1551 1426 }
1552 1427
1553 -
1554 1428 @media screen and (max-width: 767px) {
1555 - body div#wp-chatbot-ball-container {
1556 - max-width: 98%;
1557 - margin: 0 auto 3px auto;
1558 - }
1559 1429 .wp-chatbot-header {
1560 1430 padding-left: 50px;
1561 1431 padding-right: 50px;
1562 1432 }
1563 1433
1564 - .wp-chatbot-board-container{
1565 - width: 310px;
1434 + .wp-chatbot-board-container {
1435 + width: 100%;
1566 1436 }
1567 -
1437 +
1568 1438 #wp-chatbot-mobile-close {
1569 1439 position: absolute;
1570 1440 right: 12px;
1571 1441 top: 9px;
@@ -1575,11 +1445,8 @@
1575 1445 height: 30px;
1576 1446 cursor: pointer;
1577 1447 color: transparent;
1578 1448 }
1579 - #wp-chatbot-mobile-close{
1580 - display: none;
1581 - }
1582 1449
1583 1450
1584 1451
1585 1452 .wp-chatbot-notification-close {
@@ -1604,9 +1471,9 @@
1604 1471 display: inline-block !important;
1605 1472 }
1606 1473
1607 1474 .wp-chatbot-header {
1608 - padding-top: 15px;
1475 + padding-top: 50px;
1609 1476 }
1610 1477
1611 1478 #wp-chatbot-chat-container {
1612 1479 right: 30px;
@@ -1625,505 +1492,11 @@
1625 1492 .wp-chatbot-notification-container {
1626 1493 width: 250px;
1627 1494 padding-top: 55px;
1628 1495 }
1629 - .wp-chatbot-mobile-full-screen .wp-chatbot-header{
1630 - padding-top: 15px !important;
1631 - }
1632 1496 }
1633 -.wpb-search-result a{
1634 - display: block;
1497 +.wpb-search-result{}
1498 +.wpb-search-result p{}
1499 +.wpb-search-result a{display: block;
1635 1500 background: #fff;
1636 - margin-bottom: 0;
1637 - padding: 5px;
1638 -}
1639 -@media screen and (-webkit-min-device-pixel-ratio:0) {
1640 - .qcwp-chatbot-search-article input:focus,
1641 - .qcwp-chatbot-search-article input {
1642 - font-size: 14px;
1643 - }
1644 -
1645 - input#wp-chatbot-editor:focus,
1646 - input#wp-chatbot-editor {
1647 - font-size: 14px;
1648 - }
1649 -
1650 - }
1651 -/*modal form*/
1652 -.plugin-card{
1653 - width: 77% !important;
1654 - height: 186px;
1655 -}
1656 -.plugin-action-buttons li a{
1657 - font-size: 13px;
1658 -}
1659 -.name a{
1660 - text-decoration: none !important;
1661 -}
1662 -
1663 -.cxsc-settings-blocks-addon {
1664 - width: 100% !important;
1665 - }
1666 - .plugin-card {
1667 - width: 100% !important;
1668 - }
1669 - span.chatbotquote-info {
1670 - font-size: 38px;
1671 - padding: 20px 0 0 0;
1672 - position: absolute;
1673 - left: 0;
1674 - top: 32px;
1675 -}
1676 -.wp-chatbot-textanimation {
1677 - position: relative;
1678 -}
1679 -ul.wp-chatbot-messages-container > li > .wp-chatbot-paragraph .wp-chatbot-textanimation h3 {
1680 - padding: 0 0 0 22px !important;
1681 -}
1682 -span.chatbotquote-info-foot {
1683 - font-size: 38px;
1684 - padding: 0px 0 0 130px;
1685 - position: static;
1686 - bottom: -20px;
1687 - display: grid;
1688 - line-height: 0;
1689 -}
1690 -wp-chatbot-editor-container input::placeholder {
1691 - color: #181818 !important;
1692 -}
1693 -.wp-chatbot-editor-container input::-ms-input-placeholder {
1694 - color: #181818 !important;
1695 -}
1696 -.wpb-search-result a {
1697 - display: block;
1698 - background: #eeeeee00 !important;
1699 - padding: 4px 5px;
1700 - line-height: 20px;
1701 - padding-left: 0px !important;
1702 - margin-bottom: 0;
1703 - color: #222 !important;
1704 -}
1705 -.wpb-search-result a p {
1706 - margin-bottom: 0;
1707 -}
1708 -.wpb-search-result a {
1709 - color: #222;
1710 -}
1711 -.wpbot_card_caption p {
1712 - color: #222;
1713 -}
1714 -
1715 -
1716 -.wp-chatbot-textanimation ul {
1717 - margin: 12px 0 8px 20px !important;
1718 -}
1719 -.wp-chatbot-textanimation ul li {
1720 - list-style-type: "✓";
1721 - padding-left: 6px;
1722 -}
1723 -
1724 -.wp-chatbot-textanimation ul li::marker {
1725 - color: #1d73b4;
1726 - font-weight: bold;
1727 -}
1728 -
1729 -/** like dislike thumbs icons**/
1730 -
1731 -
1732 -
1733 -.qcld-like-dislike-icon {
1734 - display: none;
1735 -}
1736 -
1737 -.qcld-like-dislike-icon a {
1738 - padding: 0 5px;
1739 -}
1740 -
1741 -.qcld-like-dislike-icon i {
1742 - color: #1d73b4;
1743 -}
1744 -
1745 -ul.wp-chatbot-messages-container>li>.wp-chatbot-paragraph,
1746 -.wp-chatbot-agent-profile .wp-chatbot-bubble {
1747 - padding: 8px 15px 15px 15px;
1748 -}
1749 -
1750 -/* ul.wp-chatbot-messages-container>li.wp-chatbot-msg:hover .qcld-like-dislike-icon {
1751 - opacity: 1;
1752 -} */
1753 -.qcld-share {
1754 - position: relative;
1755 - display: inline-block;
1756 -}
1757 -
1758 -.qcld-share .share-menu {
1759 - position: absolute;
1760 - bottom: 100%;
1761 - left: -6px;
1762 - background: #fff;
1763 - border: 1px solid #ddd;
1764 - padding: 5px;
1765 - display: flex;
1766 - gap: 8px;
1767 - border-radius: 5px;
1768 -}
1769 -
1770 -.qcld-share .share-menu a {
1771 - color: #333;
1772 - font-size: 16px;
1773 -}
1774 -
1775 -/**Modal style**/
1776 -#wpbot-report-modal>div {
1777 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%) !important;
1778 - background: #1d73b4 !important;
1779 - backdrop-filter: blur(0px);
1780 - isolation: isolate;
1781 -}
1782 -
1783 -#wpbot-report-modal input#wpbot-report-email {
1784 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1785 - background: #ffffff61;
1786 - backdrop-filter: blur(0px);
1787 - isolation: isolate;
1788 - margin: 0 0;
1789 - border-radius: 6PX;
1790 - padding: 10px 10px;
1791 - border: none;
1792 - width: 96% !important;
1793 - color: #fff;
1794 -}
1795 -
1796 -#wpbot-report-modal textarea#wpbot-report-text {
1797 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1798 - background: #ffffff61;
1799 - backdrop-filter: blur(0px);
1800 - isolation: isolate;
1801 - margin: 0 0;
1802 - border-radius: 6PX;
1803 - padding: 10px 10px;
1804 - border: none;
1805 - width: 96% !important;
1806 - color: #fff;
1807 -}
1808 -
1809 -#wpbot-report-modal textarea#wpbot-report-text:focus-visible {
1810 - box-shadow: none;
1811 - outline: none;
1812 -}
1813 -
1814 -#wpbot-report-modal input#wpbot-report-email:focus-visible {
1815 - box-shadow: none;
1816 - outline: none;
1817 -}
1818 -
1819 -#wpbot-report-modal>div h3 {
1820 - font-size: 20px;
1821 - font-weight: bold;
1822 - color: #fff;
1823 -}
1824 -
1825 -#wpbot-report-modal>div label {
1826 - font-size: 16px;
1827 - font-weight: bold;
1828 - color: #fff;
1829 -}
1830 -
1831 -#wpbot-report-modal>div button {
1832 - transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
1833 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1834 - background: rgb(255 255 255 / 25%);
1835 - backdrop-filter: none;
1836 - isolation: isolate;
1837 - color: rgb(29 115 180) !important;
1838 - margin: 2px 2px;
1839 - border: 1px solid #fff !important;
1840 - padding: 8px 15px;
1841 - border-radius: 8px;
1842 - color: #ffffff !important;
1843 - font-size: 14px;
1844 - font-weight: bold;
1845 - cursor: pointer;
1846 -}
1847 -
1848 -#wpbot-report-modal>div button:hover {
1849 - transform: scale(0.95);
1850 -}
1851 -
1852 -.qcld-like-dislike-icon a .liked {
1853 - color: green;
1854 - cursor: default;
1855 - pointer-events: none;
1856 -}
1857 -
1858 -.qcld-like-dislike-icon a .disliked {
1859 - color: red;
1860 - cursor: default;
1861 - pointer-events: none;
1862 -}
1863 -
1864 -ul.wp-chatbot-messages-container>li.wp-chatbot-msg .chat-container .wp-chatbot-paragraph {
1865 - box-shadow: none;
1866 - background: transparent;
1867 - backdrop-filter: none;
1868 - isolation: inherit;
1869 -}
1870 -
1871 -
1872 -
1873 -ul.wp-chatbot-messages-container>li.wp-chatbot-msg .chat-container {
1874 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1875 - background: rgb(255 255 255 / 30%);
1876 - backdrop-filter: blur(0px);
1877 - isolation: isolate;
1878 - border-radius: 10px;
1879 - padding: 8px 15px;
1880 -}
1881 -
1882 -.qcld-like-dislike-icon {
1883 - padding: 6px 0 0 0;
1884 -}
1885 -
1886 -
1887 -
1888 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-up.liked {
1889 - position: relative;
1890 - font-size: 0px !important;
1891 -}
1892 -
1893 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-up.liked:before {
1894 - content: "\f164" !important;
1895 - left: 0px;
1896 - bottom: 0;
1897 - font-size: 16px !important;
1898 -}
1899 -
1900 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-down.disliked {
1901 - position: relative;
1902 - font-size: 0px !important;
1903 -}
1904 -
1905 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-down.disliked:before {
1906 - content: "\f165" !important;
1907 - left: 0px;
1908 - bottom: 0;
1909 - font-size: 16px !important;
1910 -}
1911 -
1912 -.qcld-like-dislike-icon a {
1913 - padding: 0 0px;
1914 -}
1915 -
1916 -.qcld-like-dislike-icon a i {
1917 - transition: all 0.2s ease-in-out;
1918 -}
1919 -
1920 -.qcld-like-dislike-icon a i:hover {
1921 - transform: scale(1.5);
1922 -}
1923 -
1924 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-up.liked:before {
1925 - transition: all 0.2s ease-in-out;
1926 -}
1927 -
1928 -.qcld-like-dislike-icon i.fa.fa-thumbs-o-down.disliked:before:hover {
1929 - transform: scale(1.5);
1930 -}
1931 -
1932 -.qcld-like-dislike-icon a {
1933 - outline: none !important;
1934 -}
1935 -
1936 -
1937 -.qcld-like-dislike-icon a {
1938 - padding: 0 10px 0 0;
1939 -}
1940 -
1941 -.qcld-like-dislike-icon .share-menu a {
1942 - padding: 0 0 0 0 !important;
1943 -}
1944 -
1945 -.qcld-like-dislike-icon i {
1946 - color: #ffffff;
1947 -}
1948 -
1949 -.wp-chatbot-textanimation ul {
1950 - margin: 12px 0 8px 20px !important;
1951 - padding: 0;
1952 -}
1953 -.qcld-like-dislike-icon i {
1954 - color: #1e74b3;
1955 -}
1956 -.qcld-like-dislike-icon a i {
1957 - font-size: 16px;
1958 - padding: 0;
1959 - height: auto;
1960 -}
1961 -.qcld-like-dislike-icon a {
1962 - padding: 0 5px 0 0;
1963 - height: 15px;
1964 -}
1965 -
1966 -
1967 -/* Icon video / YouTube inside the floating ball */
1968 -#wp-chatbot-ball .wp-chatbot-ball .wpbot-icon-video,
1969 -.wp-chatbot-ball .wpbot-icon-video {
1970 - position: absolute;
1971 - top: 0;
1972 - left: 0;
1973 - width: 100% !important;
1974 - height: 100% !important;
1975 - border-radius: 50%;
1976 - object-fit: cover;
1977 - pointer-events: none;
1978 - box-sizing: border-box;
1979 - z-index: 0;
1980 -}
1981 -
1982 -/*
1983 - * YouTube iframes ignore object-fit and letterbox in a square ball.
1984 - * Size as 16:9 cover, then scale up so title / logo / chrome are cropped by the circle.
1985 - */
1986 -#wp-chatbot-ball .wp-chatbot-ball iframe.wpbot-icon-video,
1987 -.wp-chatbot-ball iframe.wpbot-icon-video {
1988 - top: 50%;
1989 - left: 50%;
1990 - width: 100% !important; /* 16 / 9 */
1991 - height: 100% !important;
1992 - min-height: 100%;
1993 - border: 0;
1994 - transform: translate(-50%, -50%) scale(1);
1995 - transform-origin: center center;
1996 - object-fit: unset;
1997 - pointer-events: none;
1998 -}
1999 -
2000 -.wp-chatbot-ball-animator {
2001 - position: relative;
2002 - border-radius: 50%;
2003 - z-index: 1;
2004 -}
2005 -
2006 -.wp-chatbot-animation-active .wp-chatbot-ball-animation-switch {
2007 - opacity: 1;
2008 - width: 100%;
2009 - height: 100%;
2010 - position: absolute;
2011 - animation: spin 2s linear infinite;
2012 - border: 3px solid transparent;
2013 - border-top-color: #9370DB;
2014 -}
2015 -
2016 -.wp-chatbot-animation-active .wp-chatbot-ball-animation-switch:before {
2017 - content: "";
2018 - position: absolute;
2019 - top: -9px;
2020 - left: -9px;
2021 - right: -9px;
2022 - bottom: -9px;
2023 - border-radius: 50%;
2024 - border: 3px solid transparent;
2025 - border-top-color: #BA55D3;
2026 - animation: spin 3s linear infinite;
2027 -}
2028 -
2029 -.wp-chatbot-animation-active .wp-chatbot-ball-animation-switch:after {
2030 - content: "";
2031 - position: absolute;
2032 - top: -15px;
2033 - left: -15px;
2034 - right: -15px;
2035 - bottom: -15px;
2036 - border-radius: 50%;
2037 - border: 3px solid transparent;
2038 - border-top-color: #FF00FF;
2039 - animation: spin 1.5s linear infinite;
2040 -}
2041 -
2042 -@keyframes spin {
2043 - 0% {
2044 - -webkit-transform: rotate(0deg);
2045 - -ms-transform: rotate(0deg);
2046 - transform: rotate(0deg);
2047 - }
2048 -
2049 - 100% {
2050 - -webkit-transform: rotate(360deg);
2051 - -ms-transform: rotate(360deg);
2052 - transform: rotate(360deg);
2053 - }
2054 -}
2055 -
2056 -@keyframes spinHide {
2057 - 0% {
2058 - opacity: 0;
2059 - }
2060 -
2061 - 100% {
2062 - opacity: 0;
2063 - }
2064 -}
2065 -
2066 -@media screen and (min-height: 1281px) {
2067 - div#wp-chatbot-chat-container .slimScrollDiv {
2068 - height: 100vh !important;
2069 - max-height: 680px !important;
2070 - }
2071 - div#wp-chatbot-chat-container div#wp-chatbot-board-container {
2072 - height: 100vh !important;
2073 - max-height: 850px !important;
2074 - }
2075 -}
2076 -
2077 -@media screen and (max-width: 1024px) {
2078 - div#wp-chatbot-chat-container {
2079 - right: 30px !important;
2080 - bottom: 30px !important;
2081 - left: auto !important;
2082 - }
2083 - div#wp-chatbot-mobile-close {
2084 - display: none;
2085 - }
2086 -}
2087 -@media screen and (max-width: 767px) {
2088 - body div#wp-chatbot-ball-container {
2089 - max-width: 100%;
2090 - margin: 0 auto 3px auto;
2091 - width: 100%;
2092 - }
2093 -}
2094 -
2095 -@media screen and (max-width: 480px) {
2096 - div#wp-chatbot-chat-container {
2097 - right: 0px !important;
2098 - bottom: 0px !important;
2099 - left: auto !important;
2100 - }
2101 - /* Full width only below 480px while open (incl. after reset/reload) */
2102 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open {
2103 - left: 0 !important;
2104 - right: 0 !important;
2105 - bottom: 0 !important;
2106 - width: 100% !important;
2107 - max-width: 100% !important;
2108 - }
2109 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2110 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open .wp-chatbot-board-container,
2111 - .wp-chatbot-template-01 div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2112 - .wp-chatbot-mobile-full-screen.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2113 - .wp-chatbot-template-01 .wp-chatbot-mobile-full-screen.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2114 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open .slimScrollDiv,
2115 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open .wp-chatbot-ball-inner {
2116 - width: 100% !important;
2117 - max-width: 100% !important;
2118 - }
2119 - div#wp-chatbot-ball {
2120 - right: 30px;
2121 - bottom: 30px;
2122 - position: relative;
2123 -}
2124 -}
2125 -@media screen and (min-height: 1281px) {
2126 - body .wp-chatbot-ball-inner.wp-chatbot-content {
2127 - height: 660px !important; max-height: 660px !important;
2128 - }
2129 -}
1501 + margin-bottom: 7px;
1502 + padding: 5px;}