.wpforms-panel-fields .wpforms-field-row:before {
.wpforms-panel-fields .wpforms-field-row:after {
.wpforms-panel-fields #wpforms-hidden {
.wpforms-panel-fields .wpforms-field-dragging {
background-color: #f1f1f1;
.wpforms-panel-fields .wpforms-field-drag-out, .wpforms-panel-fields .wpforms-field-drag-over {
box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.25);
.wpforms-panel-fields .wpforms-field-drag-out i, .wpforms-panel-fields .wpforms-field-drag-over i {
color: rgba(255, 255, 255, 0.65);
.wpforms-panel-fields .wpforms-field-drag-placeholder {
border: 1px dashed #036aab;
background-color: #EBF3FC80;
.wpforms-panel-fields .wpforms-field-drag-placeholder.wpforms-field-drag-not-allowed {
background-color: #fcf0f1;
.wpforms-panel-fields .wpforms-field-drag-not-allowed {
cursor: not-allowed !important;
.wpforms-panel-fields .wpforms-field-drag-pending {
border: 1px dashed #036aab;
background-color: #EBF3FC80;
color: rgba(0, 0, 0, 0.7);
.wpforms-panel-fields .wpforms-field-drag-pending i {
color: rgba(0, 0, 0, 0.7);
.wpforms-panel-fields .wpforms-field-drag-pending .wpforms-loading-spinner {
background-size: 18px 18px;
#wpforms-panel-fields .wpforms-panel-sidebar {
top: calc( 124px + var( --wpforms-admin-bar-height ));
inset-inline-start: 95px;
transition-property: top, width, inset-inline-start;
transition-duration: 0.25s, 0.15s, 0.15s;
transition-timing-function: ease-out, ease-out, ease-in-out;
#wpforms-panel-fields .wpforms-panel-sidebar .no-gap {
#wpforms-panel-fields .wpforms-panel-sidebar .sub-label {
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns {
justify-content: space-between;
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns + .wpforms-field-options-columns {
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns:last-child {
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns > .wpforms-field-options-column:first-child {
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns > .wpforms-field-options-column {
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns.wpforms-field-options-columns-2 > .wpforms-field-options-column {
max-width: calc( 100%/2 - 6px);
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns.wpforms-field-options-columns-3 > .wpforms-field-options-column {
max-width: calc( 100%/3 - 9px);
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns.wpforms-field-options-columns-4 > .wpforms-field-options-column {
max-width: calc( 100%/4 - 10px);
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns.wpforms-field-options-columns-5 > .wpforms-field-options-column {
max-width: calc( 100%/5 - 10px);
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns.wpforms-field-options-columns-6 > .wpforms-field-options-column {
max-width: calc( 100%/6 - 10px);
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns.wpforms-field-options-columns-7 > .wpforms-field-options-column {
max-width: calc( 100%/7 - 11px);
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns.checkboxes-row > label {
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns.checkboxes-row > label input {
#wpforms-panel-fields .wpforms-panel-sidebar .wpforms-field-options-columns select {
#wpforms-field-options:before {
background-color: #ebf3fc;
border-bottom: 1px solid #ced7e0;
inset-inline-start: 115px;
top: calc( 125px + var( --wpforms-admin-bar-height ));
transition-property: top, width, inset-inline-start;
transition-duration: 0.25s, 0.15s, 0.15s;
transition-timing-function: ease-out, ease-out, ease-in-out;
.wpforms-panel-sidebar-closed #wpforms-field-options:before {
inset-inline-start: calc( 115px - 400px);
.wpforms-panel-fields .no-fields-preview {
min-height: calc( 100vh - 260px - var( --wpforms-admin-bar-height ));
.wpforms-panel-fields .no-fields-preview::before {
background-image: url("../../images/empty-states/no-fields.svg");
background-position: center center;
background-repeat: no-repeat;
background-size: 371px 260px;
.wpforms-panel-fields .no-fields-preview::after {
background-image: url("../../images/builder/default-arrow.svg");
background-repeat: no-repeat;
background-size: 97px 83px;
inset-inline-start: 15px;
.rtl .wpforms-panel-fields .no-fields-preview::after {
.wpforms-panel-fields .no-fields-preview h4 {
.wpforms-panel-fields .no-fields-preview p {
.wpforms-panel-fields .wpforms-title-desc {
border-bottom: 1px solid #dddddd;
.wpforms-panel-fields .wpforms-title-desc:hover {
.wpforms-panel-fields .wpforms-title-desc .wpforms-form-name {
.wpforms-panel-fields .wpforms-title-desc .wpforms-form-desc {
.wpforms-panel-fields .wpforms-title-desc .wpforms-title-desc-inner {
padding-inline-end: 200px;
.wpforms-panel-fields .wpforms-field-wrap {
.wpforms-panel-fields .wpforms-field {
border: 1px dashed transparent;
transition-property: border-color;
transition-duration: 0.25s;
transition-timing-function: ease-in;
.wpforms-panel-fields .wpforms-field:not(.wpforms-field-child-hovered):hover {
border: 1px dashed #cccccc;
.wpforms-panel-fields .wpforms-field.active {
background-color: #f8f8f8;
border: 1px dashed #cccccc;
.wpforms-panel-fields .wpforms-field .label-title {
padding-inline-end: 60px;
.wpforms-panel-fields .wpforms-field .label-title .required {
.wpforms-panel-fields .wpforms-field .label-title .hidden_text,
.wpforms-panel-fields .wpforms-field .label-title .empty_text {
.wpforms-panel-fields .wpforms-field .label-title .text {
.wpforms-panel-fields .wpforms-field .label-title .text:has(~ .required ~ .wpforms-badge) {
max-width: calc( 100% - 75px);
.wpforms-panel-fields .wpforms-field .label-title .grey .wpforms-badge {
margin-inline-start: 15px;
.wpforms-panel-fields .wpforms-field .label-title .wpforms-badge {
.wpforms-panel-fields .wpforms-field.label_empty > .label-title {
.wpforms-panel-fields .wpforms-field.label_empty > .label-title .empty_text {
.wpforms-panel-fields .wpforms-field.label_empty > .label-title .hidden_text {
display: none !important;
.wpforms-panel-fields .wpforms-field.label_hide.label_empty > .label-title .text {
.wpforms-panel-fields .wpforms-field.label_hide > .label-title {
.wpforms-panel-fields .wpforms-field.label_hide > .label-title .hidden_text {
.wpforms-panel-fields .wpforms-field.sublabel_hide .wpforms-sub-label {
.wpforms-panel-fields .wpforms-field.required .label-title .required {
margin-inline-start: 5px;
.wpforms-panel-fields .wpforms-field.required .label-title .text {
.wpforms-panel-fields .wpforms-field.required .label-title .text:has(~ .required ~ .wpforms-badge) {
max-width: calc( 100% - 90px);
.wpforms-panel-fields .wpforms-field .wpforms-sub-label {
margin-inline-start: 1px;
.wpforms-panel-fields .wpforms-field input[readonly], .wpforms-panel-fields .wpforms-field input[disabled],
.wpforms-panel-fields .wpforms-field textarea[readonly],
.wpforms-panel-fields .wpforms-field textarea[disabled],
.wpforms-panel-fields .wpforms-field select[readonly],
.wpforms-panel-fields .wpforms-field select[disabled] {
background-color: #ffffff;
border: 1px solid #cccccc;
.wpforms-panel-fields .wpforms-field input[type=text],
.wpforms-panel-fields .wpforms-field input[type=range],
.wpforms-panel-fields .wpforms-field input[type=email],
.wpforms-panel-fields .wpforms-field input[type=url],
.wpforms-panel-fields .wpforms-field input[type=password],
.wpforms-panel-fields .wpforms-field input[type=file],
.wpforms-panel-fields .wpforms-field select,
.wpforms-panel-fields .wpforms-field textarea {
background-color: #ffffff;
border: 1px solid #cccccc;
.wpforms-panel-fields .wpforms-field textarea {
.wpforms-panel-fields .wpforms-field textarea[readonly], .wpforms-panel-fields .wpforms-field textarea[disabled] {
.wpforms-panel-fields .wpforms-field input[type=checkbox],
.wpforms-panel-fields .wpforms-field input[type=radio] {
.wpforms-panel-fields .wpforms-field select[multiple] {
.wpforms-panel-fields .wpforms-field select {
padding-inline-end: 24px;
overflow: hidden !important;
.wpforms-panel-fields .wpforms-field select > option {
.wpforms-panel-fields .wpforms-field.size-small input[type=text],
.wpforms-panel-fields .wpforms-field.size-small input[type=range],
.wpforms-panel-fields .wpforms-field.size-small input[type=email],
.wpforms-panel-fields .wpforms-field.size-small input[type=url],
.wpforms-panel-fields .wpforms-field.size-small input[type=password],
.wpforms-panel-fields .wpforms-field.size-small select {
.wpforms-panel-fields .wpforms-field.size-small textarea {
.wpforms-panel-fields .wpforms-field.size-large input[type=text],
.wpforms-panel-fields .wpforms-field.size-large input[type=range],
.wpforms-panel-fields .wpforms-field.size-large input[type=email],
.wpforms-panel-fields .wpforms-field.size-large input[type=url],
.wpforms-panel-fields .wpforms-field.size-large input[type=password],
.wpforms-panel-fields .wpforms-field.size-large select {
.wpforms-panel-fields .wpforms-field.size-large textarea {