/* Overrides views_ui.admin.styling */

/* Display top spacing */
.views-ui-display-tab-actions,
.views-display-top .dropbutton-wrapper {
  margin: 1rem 0;
}
.views-display-top {
  margin-bottom: 1rem;

  .tabs .add a::before {
    display: inline-block;
    width: 8px;
    height: 8px;
    content: "";
    background-image: url(/images/svg/plus.svg);
    background-size: cover;
  }
}

/* View actions */
.views-admin ul.action-list {
  border: 2px solid black;
  background-color: white;
  padding: 4px;
}
.views-admin ul.action-list input.button[type="submit"] {
  border: none;
  padding: 0;
  text-align: left;
}
.views-displays .tabs .action-list {
  top: 100%;
}

/* Dropbuttons */
.views-edit-view .dropbutton-wrapper {
  @apply flex w-full mt-1 mb-2;
}

.views-edit-view .dropbutton-widget .dropbutton :is(a,input),
.views-edit-view .dropbutton-single .dropbutton-widget .dropbutton a {
  padding: 2px 4px;
}

/* Hide dependent fields */
.form-wrapper.views-admin-dependent {
  margin-bottom: 0;
}

/* Fix form layout */
.views-display-column.form-wrapper,
.views-display-columns.form-wrapper {
  display: block;
}
details.views-display-column > .details-wrapper {
  overflow-x: initial;
}
details[open].views-display-column > .details-wrapper {
  border-top: none;
}
.views-ui-display-tab-bucket {
  position: relative;
  padding-top : 2px;
}

/* Allow dropbutton to float right */
.views-ui-display-tab-bucket__title {
  display: inline-block;
  margin: 0;
  font-weight: bold;
}

h1.unit-title,
h1.section-title {
  @apply text-4xl;
}

h2.view-preview-form__title {
  @apply text-3xl;
}

h3.views-ui-display-tab-bucket__title {
  @apply text-xl;
}

/* Italicise overridden titles */
.views-display-setting.overridden,
.views-ui-display-tab-bucket.overridden {
  *, h3 {
    @apply italic;
  }
}

/* Remove advanced border */
.views-display-column.third {
  border: none;
}

/* Hide advanced dropdown */
.views-display-column.third[open="open"] summary {
  display: none;
}

/* Spacing between settings */
.views-ui-display-tab-bucket {
  margin-bottom: 1rem;
}

.views-display-setting {
  font-size: 14px;
}

/* Spacing after setting label */
.views-display-setting .label {
  margin-right: .5rem;
}
/* No space after | in fields. */
.views-display-setting a ~ .label {
  margin-right: 0;
}

/* Remove extra padding */
.views-ui-dialog .scroll {
  padding: 0;
}

/* Plugin filter table */
.views-ui-dialog .views-override {
  margin-bottom: 1rem;
}

/* Views admin css breaking ul */
.views-admin ul {
  padding-left: 1rem;
}

.views-live-preview.form-wrapper {
  display: block;
}

.views-live-preview .section-title {
  padding: 2rem 0 1rem;
}

/* Allow table to scroll */
.views-list-section:has(>table) {
  @apply overflow-x-scroll;
}

/* Styling for the form that allows views filters to be rearranged. */
.group-populated {
  display: none;
}

/* Unset grid for views formatted sql query. */
.views-query-info pre {
  display: block;
}

/* Unset .title class font size on views add plugin forms. */
.views-filterable-options td.title {
  font-size: medium;
}

/* Override core style */
.views-ui-dialog .views-filterable-options-controls.form--inline {
  display: flex;
}

/* Override column gap. */
@media screen and (min-width: 45em) {
  .views-display-columns > * {
    width: 30%;
    margin-left: 5%;
  }
}

.views-operator-label {
  font-weight: bold;
  font-family: var(--font-family-monospace);
  float: right;
  display: inline-block;
  margin-left: 1rem;
}