@import "https://fonts.googleapis.com/css2?family=Recursive:wght@300;400;500;600;700&display=swap";
@import "https://fonts.googleapis.com/css2?family=ZCOOL+KuaiLe&display=swap";
@import "https://fonts.googleapis.com/css2?family=ZCOOL+QingKe+HuangYou&display=swap";
@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";
:root{--global-color-1:#1f1f1f;--global-color-2:#262626;--global-color-text:#d1d0cf;--global-color-btn:#69cf95;--global-color-btn-text:#222236;--global-color-badge:#fa0;--global-path-bot-image:url(https://media.giphy.com/media/E6jscXfv3AkWQ/giphy.gif);--global-path-chat-icon:url(https://github.com/Hankkk423/chatbot_widget_website/blob/main/assets/imgs/chat-icon-s01.png?raw=true)}body,a{color:var(--global-color-text);background-color:var(--global-color-1);font-family:Recursive,sans-serif;font-size:16px;text-decoration:none}a:hover{color:inherit;text-decoration:none}button{color:inherit}h1,h2,h3,h4,h5,h6{font-weight:700}h1{font-size:48px}.btn-global{background:var(--global-color-btn);color:var(--global-color-btn-text);border:2px solid #000;border-radius:5px;padding:10px 20px;font-size:14px;font-weight:700}.btn-global:hover,.btn-global:focus{color:#fff;background:#69cf9560;border:2px solid #000}.grad-global{color:#0000;background-image:linear-gradient(79deg,#2b0aff,#ff5b8a 49% 55%,#fba64b 77%,#f99b52);-webkit-background-clip:text;background-clip:text}.grad-canva-global{color:#0000;background-image:linear-gradient(90deg,#00c4cc,#7d2ae8);-webkit-background-clip:text;background-clip:text}.tag-global{color:#399373}.p-section{padding-top:90px;padding-bottom:90px}.text-muted{color:#6c757d!important}@media (max-width:480px){body,a{font-size:12px}h1{font-size:36px}h2{font-size:28px}h3{font-size:24px}h4{font-size:20px}h5{font-size:16px}h6{font-size:12px}.p-section{padding-top:50px;padding-bottom:50px}.btn-global{padding:8px 15px;font-size:10px;font-weight:700}}.s-navbar.navbar{margin:0 5px}.s-navbar .navbar-brand{color:inherit}.s-navbar .navbar-brand img{border-radius:30px;width:40px;height:auto}.s-navbar .navbar-toggler{color:inherit;border:none}.s-navbar .navbar-nav{margin-left:auto;margin-right:auto}.s-navbar .nav-link{color:inherit;margin-left:20px}.navbar .btn-language{background-color:#0000;border:2px solid #4b2c20;border-radius:10px}@media (max-width:480px){.s-navbar .nav-button{margin-top:10px}}.s-navbar .dropdown-menu{background-color:inherit;border:none;width:100%;min-width:5px}@media (max-width:480px){.s-navbar .dropdown-menu{position:relative}}.s-navbar .dropdown-item{color:#fff;background-color:inherit}.s-navbar .dropdown-item:hover{background-color:inherit;text-decoration:underline}.s-footer{background-color:var(--global-color-1);border-top:2px solid #9a9897;padding:60px 0;font-size:14px}.s-footer img{border-radius:30px;width:40px;height:auto}.s-footer .title{color:#9a9897}.s-footer .nav .nav-link{color:inherit;background-color:#0000}.s-footer .nav .nav-link:hover{text-decoration:underline}.s-intro .intro-container{max-width:40%}@media (max-width:480px){.s-intro .intro-container{max-width:66%}}.s-pricing .card{color:inherit;background-color:var(--global-color-1);border:none;border-radius:20px;width:100%;height:auto;padding:4px}.s-pricing .card-header{background-color:inherit;border-bottom:none;margin-top:10px}.s-pricing .original-price{color:#999;text-decoration:line-through}.s-pricing .price{color:#f99269;font-size:40px;font-weight:700}.s-pricing .currency{vertical-align:baseline;font-size:16px}.s-pricing .card-popular{border:2px solid var(--global-color-badge)}.s-pricing .badge-popular{background-color:var(--global-color-badge);color:#000;border-radius:20px;width:20%;padding:5px 10px;font-size:14px;position:absolute;top:-15px;right:40%}@media (max-width:480px){.s-pricing .badge-popular{font-size:10px}}.s-faq .card{color:inherit;background-color:#0000;border:0;border-bottom:1px solid #4b2c2020}.s-faq .card-header{background-color:#0000;border-bottom:0;padding:10px 0 5px}.s-faq .card-body{padding:3px 0}.s-faq .card-header.collapsed .arrow{transform:rotate(90deg)}.s-signin .signin-container,.s-signup .signup-container{--input-padding-x:.75rem;--input-padding-y:.75rem;background-color:inherit;justify-content:center;align-items:center;height:100%;padding-top:40px;padding-bottom:40px;display:flex}.s-signin .form-sign,.s-signup .form-sign{width:100%;max-width:420px;margin:0 auto;padding:15px}.s-signin img,.s-signup img{border-radius:50px;width:100px;height:auto}.s-signin .form-label-group,.s-signup .form-label-group{margin-bottom:1rem;position:relative}.s-signin .form-label-group>input,.s-signin .form-label-group>label,.s-signup .form-label-group>input,.s-signup .form-label-group>label{padding:var(--input-padding-y)var(--input-padding-x)}.s-signin .form-label-group>label,.s-signup .form-label-group>label{color:#495057;border:1px solid #0000;border-radius:.25rem;width:100%;margin-bottom:0;line-height:1.5;transition:all .1s ease-in-out;display:block;position:absolute;top:0;left:0}.s-signin .form-label-group input::-webkit-input-placeholder{color:#0000}.s-signup .form-label-group input::-webkit-input-placeholder{color:#0000}:is(.s-signin .form-label-group input:-ms-placeholder-shown,.s-signup .form-label-group input:-ms-placeholder-shown){color:#0000}:is(.s-signin .form-label-group input:placeholder-shown,.s-signup .form-label-group input:placeholder-shown){color:#0000}.s-signin .form-label-group input::-moz-placeholder{color:#0000}.s-signup .form-label-group input::-moz-placeholder{color:#0000}.s-signin .form-label-group input::-moz-placeholder{color:#0000}.s-signup .form-label-group input::-moz-placeholder{color:#0000}.s-signin .form-label-group input::placeholder,.s-signup .form-label-group input::placeholder{color:#0000}.s-signin .form-label-group input:not(:placeholder-shown),.s-signup .form-label-group input:not(:placeholder-shown){padding-top:calc(var(--input-padding-y) + var(--input-padding-y)*(2/3));padding-bottom:calc(var(--input-padding-y)/3)}.s-signin .form-label-group input:not(:placeholder-shown)~label,.s-signup .form-label-group input:not(:placeholder-shown)~label{padding-top:calc(var(--input-padding-y)/3);padding-bottom:calc(var(--input-padding-y)/3);color:#777;font-size:10px}.s-generate .hero .container{width:50%}@media (max-width:480px){.s-generate .hero .container{width:100%}}.s-generate .outputer .img-area{background-color:#fff;border:2px solid #000;border-radius:20px;width:500px;height:500px}@media (max-width:480px){.s-generate .outputer .img-area{width:350px;height:350px}}:root{--global-path-bot-image:url(https://media.giphy.com/media/E6jscXfv3AkWQ/giphy.gif);--global-path-chat-icon:url(https://github.com/Hankkk423/chatbot_widget_website/blob/main/assets/imgs/chat-icon-s01.png?raw=true)}.chat-widget{width:100%;height:500px;position:relative}.chat-container{background-color:#fff;border-radius:10px;width:100%;height:100%;max-height:100%;box-shadow:0 0 10px #0003}.chat-header{color:#fff;background-color:#000;border-top-left-radius:10px;border-top-right-radius:10px;padding:10px 20px;font-size:18px;font-weight:700}.chat-header-design{box-sizing:border-box;justify-content:flex-start;align-items:center;margin:0;display:flex;position:relative}.chat-header-avatar{box-sizing:border-box;outline:none;flex-shrink:0;width:60px;height:60px;margin:0 22px 0 0;padding:0;position:relative}.header-avatar-image{background-color:#4caf4f40;background-image:var(--global-path-bot-image);background-size:cover;border-radius:50%;flex-shrink:0;width:100%;height:100%;margin-right:10px}.header-avatar-status{box-sizing:border-box;background:#69de40;border:1px solid #fff;border-radius:100%;outline:none;flex-shrink:0;width:16%;height:16%;margin:0;padding:0;display:block;position:absolute;bottom:7%;right:7%}.chat-header-company{box-sizing:border-box;outline:none;flex-grow:1;flex-shrink:0;width:0;margin:0;padding:0}.header-company-name{box-sizing:border-box;white-space:nowrap;text-overflow:ellipsis;cursor:default;color:#f1ecec;outline:none;flex-shrink:0;margin:0;padding:0 15px 0 0;font-size:24px;font-weight:600;line-height:31px}.header-company-status{box-sizing:border-box;cursor:default;color:#9ba6b3;outline:none;flex-shrink:0;margin:0;padding:0;font-size:15px;line-height:19px}.chat-log{background:#fff;height:72%;padding:10px;overflow-y:scroll}.chat-box{display:flex}.chat-box-typing{width:90%}.chat-box-sending{justify-content:center;align-items:center;width:10%;display:flex}.chat-user-input{border:none;border-top:1px solid #ccc;border-bottom-right-radius:10px;border-bottom-left-radius:10px;outline:none;width:100%;padding:2px 15px}.user-message{justify-content:flex-end;align-items:center;margin-bottom:10px;margin-left:30px;display:flex}.user-bubble{color:#fff;width:inherit;background-color:#1e90ff;border-radius:10px;margin-right:5px;padding:8px;overflow-x:scroll}.bot-message{justify-content:flex-start;align-items:flex-start;margin-bottom:10px;margin-right:30px;display:flex}.bot-avatar{background-color:#4caf4f40;background-image:var(--global-path-bot-image);background-size:cover;border-radius:50%;flex-shrink:0;width:30px;height:30px;margin-right:10px}.bot-bubble{color:#000;width:inherit;background-color:#e8f5e9;border-radius:10px;margin-left:5px;padding:8px;overflow-x:scroll}@keyframes flash{0%,to{opacity:1;transition:all ease-out}50%{opacity:0;transition:all ease-in}}.bot-bubble.is-replying{animation:1.5s infinite flash}.chat-markdown-table{-webkit-overflow-scrolling:touch;overflow:scroll}.chat-markdown-table table{border-collapse:collapse}.chat-markdown-table th,.chat-markdown-table td{white-space:nowrap;text-align:left;border:1px solid #d0d0d0;padding:6px 10px}.s-wave .table-container{background-color:var(--global-color-2)!important}.s-wave .table-container .MuiTableCell-root{color:#d1d0cf!important;border-color:#d1d0cf33!important}.s-wave .table-container .MuiTableHead-root{background-color:var(--global-color-2)!important}.s-wave .table-container .MuiTableRow-root:hover{background-color:var(--global-color-2)!important;transition:background-color .3s!important}
