@tailwind components;
@tailwind utilities;

/*
 * Attribute-term edit field layout for the shared swatch controls.
 *
 * Keeps the WordPress term table layout stable when fields are shown/hidden.
 */

.b3-wvs-color-field {
  @apply b3-wvs-w-full;
  position: relative;
  overflow: visible;
}

.b3-wvs-color-field td {
  @apply b3-wvs-block b3-wvs-w-full b3-wvs-max-w-full b3-wvs-overflow-visible;
}

.b3-wvs-color-field .wp-picker-container {
  @apply b3-wvs-inline-block b3-wvs-align-top b3-wvs-m-0;
}

.b3-wvs-color-picker {
  @apply b3-wvs-max-w-[100px];
}

.b3-wvs-color-field .wp-color-result {
  margin: 0 6px 0 0 !important;
  vertical-align: middle;
}

.b3-wvs-color-field th {
  @apply b3-wvs-w-auto b3-wvs-min-w-[200px] b3-wvs-pr-2.5 b3-wvs-align-top;
}

.b3-wvs-color-field * {
  @apply b3-wvs-float-none;
}

.b3-wvs-color-field .wp-picker-holder {
  @apply b3-wvs-absolute b3-wvs-z-[10000];
  top: auto !important;
  bottom: 100% !important;
  @apply b3-wvs-mb-2;
}