/* re-skin the right-hand off-canvas sidebar to be light-themed.. *shudders* */
/* remove off-canvas wrapper box-shadow and color swap wrapper */
.ui-dialog.ui-dialog-off-canvas {
  background-color: #fff;
  color: var(--dark);
  box-shadow: none;
  /* border-left: 1px solid var(--primary) !important; */
  border: none;
}
/* off-canvas and modal title bars */
.ui-dialog-titlebar {
  background-color: var(--primary) !important;
  color: #fff !important;
  border-bottom: 1px solid var(--primary) !important;
}

#drupal-off-canvas {
  background-color: #fff;
  color: var(--dark);
}

/* off-canvas background and text color swaps */
#drupal-off-canvas *,
#drupal-off-canvas *:not(div),
#drupal-off-canvas .inline-block-create-button,
#drupal-off-canvas .inline-block-list__item
{
  background-color: #fff;
  color: var(--dark);
  transition: background-color 1s;
  border: 0 !important;
}
/* off-canvas hover-state swaps */
#drupal-off-canvas .inline-block-create-button:hover,
#drupal-off-canvas .inline-block-create-button:focus,
#drupal-off-canvas .inline-block-list__item:hover,
#drupal-off-canvas .inline-block-list__item:focus
{
  text-decoration: none;
  background-color: #ededed;
  transition: 0.8s;
}
/* hide un-used stuff during or after auto-clicker */
#drupal-off-canvas .form-search, /* block filter field */
#drupal-off-canvas .inline-block-create-button, /* "create custom block" button */
#drupal-off-canvas > div > a.use-ajax, /* custom block back button */
#drupal-off-canvas .block-categories /* initial list of blocks displayed (clicked-through from auto-clicker) */
{
  display:none !important;
}
/* recude margin during layout selection */
#drupal-off-canvas .layout-selection li {
  padding-bottom: 0;
  border: 0;
}
/* fix coloring on the "move block" panel */
#drupal-off-canvas tr:hover td,
#drupal-off-canvas tr.drag td,
#drupal-off-canvas tr.drag-previous td,
#drupal-off-canvas tr.drag-previous:hover td
{
  background: #fff;
}

/* layout builder UI adjustments */
/* modify the display of the content preview checkbox for all screens */
#edit-preview-toggle {
  margin-top: 14px;
}

/* no gutters between elements on the layout editor, this is handled by the layout themselves (the bootstrap columns) */
#layout-builder .layout-builder-block {
  padding: 0;
}

/* remove "Configure Section" link from all layout builder sections */
/*a.layout-builder__link--configure {
  line-height: 0;
  font-size: 0;
  color: transparent;
}*/

/* add a visible X to the "close modal" button */
div.ui-dialog button.ui-dialog-titlebar-close {
  background-image: url('/themes/custom/clarkwagov/img/icons/x-mark-white.svg') !important;
}
/* remove the default X icon that keeps coming and going */
.ui-button .ui-icon {
  background-image: none !important;
}

/* remove vertical tabs at the bottom of the layout builder display */
form#node-page-layout-builder-form div.form-type-vertical-tabs {
  display:none;
}

/* fix draggable handle and form layout in the modal for the link list and news inline blocks */
#layout-builder-modal .field--name-field-link-item a.tabledrag-handle .handle,
#layout-builder-modal .field--name-field-news-articles a.tabledrag-handle .handle {
  width: 30px;
  height: 50px;
  margin-left: 20px;
}
#layout-builder-modal .field--name-field-link-item .description,
#layout-builder-modal .field--name-field-news-articles .description {
  display: none;
}
#layout-builder-modal .field--name-field-link-item td {
  padding: 30px 0 5px;
  border-bottom: 1px solid var(--info);
}
#layout-builder-modal .field--name-field-news-articles td {
  padding: 10px;
  border-bottom: 1px solid var(--info);
}

/* wysiwyg editor adjustments */
/* better height for wysiwyg link modal window */
.editor-linkit-dialog #drupal-modal {
  height: 400px !important;
  max-height: 350px !important;
}
/* respect align:center; button */
.align-center {
  text-align:center;
}
/* add margin to images aligned with the media alignment options */
.align-left img {
  margin-right: 1rem !important;
}
.align-right img {
  margin-left: 1rem !important;
}
/* hide "about text formats" link */
.filter-wrapper {
  display:none;
}

@media (min-width: 992px) {
  /* modify the display of the content preview checkbox and the publishing status dropdown*/
  #edit-moderation-state-0 {
    display: flex;
  }
  #edit-moderation-state-0 div {
    margin-top: 0;
    margin-right: 60px;
  }
}