#wpforms-setup-templates-list .wpforms-template#wpforms-template-generate:hover, #wpforms-setup-templates-list .wpforms-template#wpforms-template-generate.selected {
box-shadow: 0 0 0 2px #5c24a9, 0 3px 4px rgba(0, 0, 0, 0.15);
#wpforms-setup-templates-list .wpforms-template#wpforms-template-generate .wpforms-template-thumbnail {
background-color: #faf5fe;
#wpforms-setup-templates-list .wpforms-template#wpforms-template-generate .wpforms-template-name-wrap {
#wpforms-setup-templates-list .wpforms-template#wpforms-template-generate .wpforms-template-name-wrap .wpforms-template-name {
#wpforms-setup-templates-list .wpforms-template#wpforms-template-generate .wpforms-template-name-wrap .wpforms-badge {
#wpforms-setup-templates-list .wpforms-template#wpforms-template-generate .wpforms-template-generate.wpforms-inactive {
background-color: #7a30e2;
#wpforms-setup-templates-list .wpforms-template#wpforms-template-generate .wpforms-template-generate.wpforms-inactive:hover {
background-color: #7a30e2;
#wpforms-setup-templates-list .wpforms-template#wpforms-template-generate .wpforms-template-generate.wpforms-inactive:focus {
#wpforms-panel-ai-form .wpforms-panel-sidebar {
#wpforms-panel-ai-form .wpforms-panel-sidebar-header {
border-bottom: 1px solid #ced7e0;
#wpforms-panel-ai-form .wpforms-btn-back-to-templates {
background-color: transparent;
padding: 15px 15px 15px 43px;
#wpforms-panel-ai-form .wpforms-btn-back-to-templates:hover {
text-decoration: underline;
#wpforms-panel-ai-form .wpforms-btn-back-to-templates:before {
background-image: url("../../../images/integrations/ai/back.svg");
background-size: 13px 11px;
transform: translateY(-50%);
#wpforms-panel-ai-form .wpforms-panel-content-wrap {
#wpforms-panel-ai-form .wpforms-panel-content.wpforms-panel-fields {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-panel-empty-state {
height: calc( 100vh - 200px - var( --wpforms-admin-bar-height ));
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-panel-empty-state::before {
background-image: url("../../../images/integrations/ai/ai-form-empty-state.svg");
background-position: center center;
background-repeat: no-repeat;
background-size: 568px 284px;
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-panel-empty-state h4 {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-panel-empty-state p {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-title {
margin: 0 15px 15px 15px;
border-bottom: 1px solid #dddddd;
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field:has(> .placeholder.fade-out) {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field:has(.wpforms-ai-form-generator-hidden) {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field .placeholder {
width: calc( 100% - 30px);
background: linear-gradient(92deg, #fcfcfc 50%, #f8f8f8 100%);
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field .placeholder.fade-out {
animation: fade-out .25s ease-in;
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field .wpforms-field {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field .wpforms-field.fade-in {
animation: fade-in .25s ease-in;
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field .wpforms-field:hover {
border-color: transparent;
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field .wpforms-field:hover.wpforms-field-divider:not(:empty)::before {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field .wpforms-field:hover.wpforms-pagebreak-normal .wpforms-pagebreak-buttons {
border-color: transparent;
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field .wpforms-field:hover.wpforms-pagebreak-normal .wpforms-pagebreak-divider {
background-color: #626262;
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field .wpforms-field:hover.wpforms-pagebreak-normal .wpforms-pagebreak-divider span:not(.wpforms-badge) {
background-color: #626262;
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field .wpforms-field:empty::before {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field label,
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field input,
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field select,
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field textarea,
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-field button {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-pagebreak-normal .wpforms-pagebreak-divider {
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-submit {
margin: 20px 15px 15px 15px;
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-addons-notice {
margin: 20px 15px 15px 15px;
#wpforms-panel-ai-form .wpforms-panel-content .wpforms-ai-form-generator-preview-addons-notice .wpforms-alert-message a {
text-decoration: underline;
wpforms-ai-chat:has(textarea) {
--wpforms-ai-chat-input-height: 54px;
--wpforms-ai-chat-message-list-offset: 79px;
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list {
height: calc( 100% - var( --wpforms-ai-chat-input-height, 54px ) - var( --wpforms-ai-chat-message-list-offset, 41px ));
max-height: calc( 100% - var( --wpforms-ai-chat-input-height, 54px ) - var( --wpforms-ai-chat-message-list-offset, 41px ));
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list.wpforms-scrollbar-compact {
scrollbar-gutter: stable;
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list.wpforms-scrollbar-compact .wpforms-chat-item-error .wpforms-chat-item-content {
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list .wpforms-chat-item-question {
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list .wpforms-chat-item-answer .wpforms-chat-item-content h4,
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list .wpforms-chat-item-warning .wpforms-chat-item-content h4,
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list .wpforms-chat-item-error .wpforms-chat-item-content h4 {
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list .wpforms-chat-item-answer .wpforms-chat-item-content .wpforms-ai-chat-answer-buttons,
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list .wpforms-chat-item-warning .wpforms-chat-item-content .wpforms-ai-chat-answer-buttons,
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list .wpforms-chat-item-error .wpforms-chat-item-content .wpforms-ai-chat-answer-buttons {
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list .wpforms-chat-item-pre-message .wpforms-ai-chat-answer-buttons {
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list .wpforms-chat-item-answer:last-child {
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-list .wpforms-chat-item-content {
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-inactive .wpforms-chat-item-answer:not(.active) .wpforms-chat-item-content {
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-input {
height: calc( var( --wpforms-ai-chat-input-height, 54px ) + var( --wpforms-ai-chat-message-list-offset, 50px ));
max-height: calc( var( --wpforms-ai-chat-input-height, 54px ) + var( --wpforms-ai-chat-message-list-offset, 50px ));
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-input .wpforms-ai-chat-send,
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-input .wpforms-ai-chat-stop {
wpforms-ai-chat:has(textarea) .wpforms-ai-chat-message-input textarea {
margin-top: 6px !important;
wpforms-ai-chat[mode="forms"] {
height: calc( 100% - 50px);
--wpforms-ai-chat-message-list-offset: 40px;
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-message-list {
padding: 20px 20px 0 19px !important;
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-message-list .wpforms-ai-chat-header h3.wpforms-ai-chat-header-title {
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-message-list .wpforms-ai-chat-header .wpforms-ai-chat-header-description a {
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-message-list.wpforms-scrollbar-compact {
padding: 20px 6px 0 19px !important;
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-message-list .wpforms-ai-chat-divider {
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-message-input {
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-message-input .wpforms-ai-chat-send,
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-message-input .wpforms-ai-chat-stop {
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-message-input textarea {
margin-top: unset !important;
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-sample-restaurant {
background-image: url("../../../images/integrations/ai/icon-restaurant.svg");
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-sample-ticket {
background-image: url("../../../images/integrations/ai/icon-ticket.svg");
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-sample-design {
background-image: url("../../../images/integrations/ai/icon-design.svg");
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-sample-stop {
background-image: url("../../../images/integrations/ai/icon-stop-sign.svg");
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-sample-pizza {
background-image: url("../../../images/integrations/ai/icon-pizza.svg");
wpforms-ai-chat[mode="forms"] .wpforms-ai-chat-welcome-screen-sample-prompts i.wpforms-ai-chat-sample-market {
background-image: url("../../../images/integrations/ai/icon-market.svg");
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item .wpforms-ai-chat-header .wpforms-ai-chat-header-description {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item .wpforms-ai-chat-header .wpforms-ai-chat-header-description a {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item .wpforms-ai-chat-header .wpforms-ai-chat-header-description a:hover, wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-ai-chat-message-item .wpforms-ai-chat-header .wpforms-ai-chat-header-description a:focus {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-question {
background-color: #0399ed;
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-spinner {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer .wpforms-chat-item-content,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning .wpforms-chat-item-content {
border: 2px solid transparent;
transition-property: border-color;
transition-duration: 0.15s;
transition-timing-function: ease-out;
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer .wpforms-chat-item-content:hover,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning .wpforms-chat-item-content:hover {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer .wpforms-chat-item-content h4,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning .wpforms-chat-item-content h4 {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer .wpforms-ai-chat-answer-buttons button span,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning .wpforms-ai-chat-answer-buttons button span {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer:not(.active) .wpforms-ai-chat-answer-buttons,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning:not(.active) .wpforms-ai-chat-answer-buttons {
border-top: 1px solid #ced7e0;
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer:not(.active) .wpforms-ai-chat-answer-buttons button,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning:not(.active) .wpforms-ai-chat-answer-buttons button {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer:not(.active) .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-buttons-response .wpforms-ai-chat-answer-button.dislike,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning:not(.active) .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-buttons-response .wpforms-ai-chat-answer-button.dislike {
background-image: url("../../../images/integrations/ai/thumbs-down-inactive.svg");
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer:not(.active) .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-buttons-response button,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning:not(.active) .wpforms-ai-chat-answer-buttons .wpforms-ai-chat-answer-buttons-response button {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer:not(.active) .wpforms-ai-chat-answer-action,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning:not(.active) .wpforms-ai-chat-answer-action {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer.active .wpforms-chat-item-content,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning.active .wpforms-chat-item-content {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer.active .wpforms-chat-item-content:hover,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning.active .wpforms-chat-item-content:hover {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-answer.active .wpforms-ai-chat-answer-buttons button,
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-warning.active .wpforms-ai-chat-answer-buttons button {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-error .wpforms-chat-item-content {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-error .wpforms-chat-item-content h4 {
wpforms-ai-chat.wpforms-ai-chat-blue .wpforms-ai-chat-message-list .wpforms-chat-item-error .wpforms-chat-item-content span a {