PluginProbe
WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services / 3.4.2
WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services v3.4.2
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 +47 -680 8.7.23.4.2 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*/
@@ -1216,42 +1227,20 @@
1216 1227 .wp-chatbot-notification-message {
1217 1228 transition: opacity 0.5s;
1218 1229 }
1219 1230
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 1231 #wp-chatbot-desktop-close {
1243 -display: block;
1232 + display: block;
1244 1233 position: absolute;
1245 - right: 3px;
1234 + right: -5px;
1246 1235 padding: 5px;
1247 1236 font-size: 14px;
1248 1237 font-family: "Arial";
1249 1238 line-height: 20px;
1250 - top: -20px;
1239 + top: -30px;
1251 1240 width: 30px;
1252 1241 height: 30px;
1253 - background-color: transparent;
1242 + background-color: #7d8999;
1254 1243 border-radius: 50%;
1255 1244 color: #ffffff;
1256 1245 cursor: pointer;
1257 1246 text-align: center;
@@ -1259,19 +1248,8 @@
1259 1248 transition: 0.2s;
1260 1249 transform: translateY(20px);
1261 1250 }
1262 1251
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 1252 .wp-chatbot-notification-close {
1275 1253 display: block;
1276 1254 position: absolute;
1277 1255 right: 0;
@@ -1300,11 +1278,9 @@
1300 1278 .wp-chatbot-notification-container:hover .wp-chatbot-notification-close {
1301 1279 visibility: visible;
1302 1280 transform: translateY(0px);
1303 1281 }
1304 -ul.wp-chatbot-messages-container > li > .wp-chatbot-paragraph{
1305 - display: block !important;
1306 -}
1282 +
1307 1283 .wp-chatbot-ball-cart-items {
1308 1284 bottom: -8px;
1309 1285 left: -11px;
1310 1286 position: absolute;
@@ -1370,11 +1346,9 @@
1370 1346 background-position: 0 -80px;
1371 1347 border: none !important;
1372 1348 box-shadow: none !important;
1373 1349 }
1374 -.swal2-container {
1375 - z-index: 99999999;
1376 -}
1350 +
1377 1351 .facebook-messenger {
1378 1352 background-position: 0 -80px;
1379 1353 }
1380 1354
@@ -1410,112 +1384,8 @@
1410 1384 .fb_dialog > .fb_dialog_content {
1411 1385 opacity: 0.01;
1412 1386 }
1413 1387
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 1388 /****************************************************************************************************
1519 1389 11 Responsive
1520 1390 ****************************************************************************************************/
1521 1391 @media screen and (max-width: 1200px) {
@@ -1558,23 +1428,18 @@
1558 1428 }
1559 1429
1560 1430 }
1561 1431
1562 -
1563 1432 @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 1433 .wp-chatbot-header {
1569 1434 padding-left: 50px;
1570 1435 padding-right: 50px;
1571 1436 }
1572 1437
1573 - .wp-chatbot-board-container{
1574 - width: 310px;
1438 + .wp-chatbot-board-container {
1439 + width: 100%;
1575 1440 }
1576 -
1441 +
1577 1442 #wp-chatbot-mobile-close {
1578 1443 position: absolute;
1579 1444 right: 12px;
1580 1445 top: 9px;
@@ -1584,11 +1449,8 @@
1584 1449 height: 30px;
1585 1450 cursor: pointer;
1586 1451 color: transparent;
1587 1452 }
1588 - #wp-chatbot-mobile-close{
1589 - display: none;
1590 - }
1591 1453
1592 1454
1593 1455
1594 1456 .wp-chatbot-notification-close {
@@ -1613,9 +1475,9 @@
1613 1475 display: inline-block !important;
1614 1476 }
1615 1477
1616 1478 .wp-chatbot-header {
1617 - padding-top: 15px;
1479 + padding-top: 50px;
1618 1480 }
1619 1481
1620 1482 #wp-chatbot-chat-container {
1621 1483 right: 30px;
@@ -1634,506 +1496,11 @@
1634 1496 .wp-chatbot-notification-container {
1635 1497 width: 250px;
1636 1498 padding-top: 55px;
1637 1499 }
1638 - .wp-chatbot-mobile-full-screen .wp-chatbot-header{
1639 - padding-top: 15px !important;
1640 - }
1641 1500 }
1642 -.wpb-search-result a{
1643 - display: block;
1501 +.wpb-search-result{}
1502 +.wpb-search-result p{}
1503 +.wpb-search-result a{display: block;
1644 1504 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 -@media screen and (min-height: 1281px) {
2077 - div#wp-chatbot-chat-container .slimScrollDiv {
2078 - height: 100vh !important;
2079 - max-height: 680px !important;
2080 - }
2081 - div#wp-chatbot-chat-container div#wp-chatbot-board-container {
2082 - height: 100vh !important;
2083 - max-height: 850px !important;
2084 - }
2085 -}
2086 -
2087 -@media screen and (max-width: 1024px) {
2088 - div#wp-chatbot-chat-container {
2089 - right: 30px !important;
2090 - bottom: 30px !important;
2091 - left: auto !important;
2092 - }
2093 - div#wp-chatbot-mobile-close {
2094 - display: none;
2095 - }
2096 -}
2097 -@media screen and (max-width: 767px) {
2098 - body div#wp-chatbot-ball-container {
2099 - max-width: 100%;
2100 - margin: 0 auto 3px auto;
2101 - width: 100%;
2102 - }
2103 -}
2104 -
2105 -@media screen and (max-width: 480px) {
2106 - div#wp-chatbot-chat-container {
2107 - right: 0px !important;
2108 - bottom: 0px !important;
2109 - left: auto !important;
2110 - }
2111 - /* Full width only below 480px while open (incl. after reset/reload) */
2112 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open {
2113 - left: 0 !important;
2114 - right: 0 !important;
2115 - bottom: 0 !important;
2116 - width: 100% !important;
2117 - max-width: 100% !important;
2118 - }
2119 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2120 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open .wp-chatbot-board-container,
2121 - .wp-chatbot-template-01 div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2122 - .wp-chatbot-mobile-full-screen.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2123 - .wp-chatbot-template-01 .wp-chatbot-mobile-full-screen.wp-chatbot-mobile-fs-open #wp-chatbot-board-container,
2124 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open .slimScrollDiv,
2125 - div#wp-chatbot-chat-container.wp-chatbot-mobile-fs-open .wp-chatbot-ball-inner {
2126 - width: 100% !important;
2127 - max-width: 100% !important;
2128 - }
2129 - div#wp-chatbot-ball {
2130 - right: 30px;
2131 - bottom: 30px;
2132 - position: relative;
2133 -}
2134 -}
2135 -@media screen and (min-height: 1281px) {
2136 - body .wp-chatbot-ball-inner.wp-chatbot-content {
2137 - height: 660px !important; max-height: 660px !important;
2138 - }
2139 -}
1505 + margin-bottom: 7px;
1506 + padding: 5px;}