.is-dragging .postbox-header {
  border-bottom: none;
}
.is-dragging .inside {
  display: none;
}

.wu-hide-inside .postbox-header {
  border-bottom: none;
}
.wu-hide-inside .inside {
  display: none;
}

.wu-draggable-ghost {
  border-style: dashed !important;
  border-width: 1px !important;
  border-color: #939393 !important;
  opacity: 75%;
}
.wu-draggable-ghost .postbox-header {
  background: #edf2f6;
  border: none;
}

.wu-draggable-field-ghost {
  content: " ";
  text-indent: -9999999px;
  background-color: #fff !important;
}
.wu-draggable-field-ghost td {
  border: dashed 1px #c3c4c7;
  border-width: 1px 0;
  opacity: 0.9;
  padding: 10px;
}
.wu-draggable-field-ghost .wu-placeholder-sortable {
  display: none;
}

/* Mobile responsive styles for checkout form editor */
@media screen and (max-width: 782px) {

  /* Stack the top header bar vertically */
  #wu-checkout-editor-app .postbox > .wu-flex.wu-items-center {
    flex-direction: column;
    gap: 8px;
  }
  #wu-checkout-editor-app .postbox > .wu-flex.wu-items-center > div {
    width: 100% !important;
    text-align: center;
  }
  #wu-checkout-editor-app .postbox > .wu-flex.wu-items-center > div:last-child {
    text-align: center;
  }
  #wu-checkout-editor-app .postbox > .wu-flex.wu-items-center > div ul {
    justify-content: center;
  }

  /* Hide the ORDER column on mobile (both header and data cells).
     WordPress's responsive CSS uses th.column-primary ~ th to hide columns
     AFTER column-primary, but ORDER precedes it so needs explicit hiding.
     The order number is still accessible via the toggle-row "Show more details" button. */
  #wu-checkout-editor-app .column-order {
    display: none !important;
  }

  /* Hide the move/drag column on mobile — drag reordering is impractical on touch */
  #wu-checkout-editor-app .column-move {
    display: none !important;
  }

  /* Ensure the step action buttons stack properly on mobile */
  #wu-checkout-editor-app .wu-bg-gray-100 ul {
    flex-direction: column;
    align-items: center;
  }
  #wu-checkout-editor-app .wu-bg-gray-100 ul li {
    margin-left: 0 !important;
    margin-bottom: 4px;
  }
}