/////
////Gutenburg
/////
.tesrting {
  .interface-interface-skeleton__header,
  .interface-interface-skeleton__sidebar,
  .edit-post-editor__inserter-panel,
  .components-popover__content,
  .interface-interface-skeleton__footer,
  .block-editor-inserter__tabs .components-tab-panel__tabs {
    filter: invert(1) hue-rotate(180deg);
    img {
      filter: invert(1) hue-rotate(180deg);
    }
    .block-editor-inserter__block-list {
      background: #fff;
    }
    .block-editor-inserter__tabs .components-tab-panel__tab-content {
      background: #fff;
    }
  }
  .edit-post-visual-editor h1.editor-post-title {
    color: inherit;
  }
  .edit-post-fullscreen-mode-close.components-button {
    filter: invert(1) hue-rotate(180deg);
  }

  ///Woocommerce

  .woocommerce-chart,
  .woocommerce-dashboard__store-performance .woocommerce-summary {
    filter: invert(1) hue-rotate(180deg);
  }

  .woocommerce-dashboard__columns .woocommerce-table,
  .woocommerce-page .woocommerce-dropdown-button {
    filter: invert(1) hue-rotate(180deg);
  }
}

//Base backgrounds
.interface-interface-skeleton__secondary-sidebar,
.interface-interface-skeleton__sidebar,
.interface-complementary-area,
.components-panel__header.interface-complementary-area-header__small,
.interface-complementary-area-header,
.components-panel,
.components-text-control__input,
.components-textarea-control__input,
.components-input-control__container,
.components-search-control input[type="search"].components-search-control__input,
.interface-interface-skeleton__footer,
.interface-interface-skeleton__footer .block-editor-block-breadcrumb,
.interface-interface-skeleton__header,
.edit-post-header,
.block-editor-block-contextual-toolbar,
.components-modal__frame {
  --uip-color-base-0: rgba(30, 30, 30, 1);
  background: var(--uip-color-base-0);
}

//Secondary background
.components-panel__body > .components-panel__body-title:hover,
.components-checkbox-control__input[type="checkbox"],
.css-1g6knzi,
.components-popover__content:not(:has(.block-editor-block-contextual-toolbar)),
.block-editor-block-inspector__no-blocks,
.components-button.editor-post-last-revision__title:active,
.components-button.editor-post-last-revision__title:hover,
.components-toggle-group-control {
  background: var(--uip-color-base-1);
}

//Third background
.components-form-token-field__remove-token.components-button,
.components-form-token-field__token-text,
.editor-post-featured-image__toggle,
.block-editor-tools-panel-color-gradient-settings__dropdown > button.is-open,
.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active,
.components-toggle-group-control [role="presentation"],
.components-button.is-secondary:disabled,
.components-button.is-secondary[aria-disabled="true"],
.components-button.is-secondary[aria-disabled="true"]:hover,
.components-button.is-tertiary:disabled,
.components-button.is-tertiary[aria-disabled="true"],
.components-button.is-tertiary[aria-disabled="true"]:hover {
  background: var(--uip-color-base-2);
}

.components-checkbox-control__input[type="checkbox"]:focus {
  box-shadow: 0 0 0 2px var(--uip-color-base-2), 0 0 0 4px var(--wp-admin-theme-color);
}

//Color default
.components-button.edit-post-sidebar__panel-tab,
.components-panel,
.css-jz9ghk.css-jz9ghk.css-jz9ghk,
.css-1imalal,
.components-form-token-field__input-container input[type="text"].components-form-token-field__input,
.components-form-token-field__token,
.components-text-control__input,
.editor-post-featured-image__toggle,
.components-textarea-control__input,
.components-button,
.block-editor-block-inspector__no-blocks,
.components-text,
.components-select-control__input,
.components-input-control__input,
.fbfdf-deef-d-a-dfdbc-1rk70b8.fbfdf-deef-d-a-dfdbc-1rk70b8.fbfdf-deef-d-a-dfdbc-1rk70b8,
.block-editor-block-icon.has-colors svg,
.components-search-control input[type="search"].components-search-control__input,
.interface-interface-skeleton__footer,
.interface-interface-skeleton__footer .block-editor-block-breadcrumb,
.block-editor-block-breadcrumb__button.components-button,
.block-editor-block-breadcrumb__current,
.interface-interface-skeleton__header,
.edit-post-header,
.block-editor-block-contextual-toolbar,
.components-modal__frame {
  color: var(--uip-text-color-base);
}
//Color default important required
.components-select-control__input,
.components-input-control__input {
  color: var(--uip-text-color-base) !important;
}

//Color emphasis
.components-button.edit-post-sidebar__panel-tab.is-active,
.components-panel__body-toggle.components-button,
.interface-complementary-area h2,
.cdbc-a-a--cbc-1bjabos,
.components-heading,
.editor-post-visibility__label {
  color: var(--uip-text-color-emphasis);
}

//Primary colour
.holderuntilneeded {
  color: var(--wp-admin-theme-color);
}

//Border colour:
.interface-interface-skeleton__sidebar,
.block-editor-inserter__tabs .components-tab-panel__tabs,
.interface-interface-skeleton__footer,
.components-search-control input[type="search"].components-search-control__input,
.edit-post-header,
.interface-interface-skeleton__header,
.block-editor-block-contextual-toolbar,
.components-dropdown-menu__menu .components-menu-group + .components-menu-group {
  border-color: var(--uip-border-color);
  * {
    border-color: var(--uip-border-color);
  }
}

//Border
.components-search-control input[type="search"].components-search-control__input {
  border: 1px solid var(--uip-border-color);
}

//Border bottom
.edit-post-fullscreen-mode-close.components-button {
  border-bottom: 1px solid var(--uip-border-color);
}

//Red danger
.components-button.is-destructive {
  border-color: var(--uip-color-red);
  color: var(--uip-color-red);
  box-shadow: inset 0 0 0 1px var(--uip-color-red);
}
/////
////
///Custom specific
//////
/////
.components-color-palette__custom-color {
  background-image: repeating-linear-gradient(45deg, var(--uip-color-base-2) 25%, transparent 0, transparent 75%, var(--uip-color-base-2) 0, var(--uip-color-base-2)),
    repeating-linear-gradient(45deg, var(--uip-color-base-2) 25%, transparent 0, transparent 75%, var(--uip-color-base-2) 0, var(--uip-color-base-2));
}

//Outline border
.components-popover__content {
  outline: 1px solid var(--uip-border-color);
}

//Notices
.components-notice {
  background: var(--uip-color-base-1);
  color: var(--uip-text-color-base);
  border-color: var(--uip-border-color);
}
.components-notice.is-warning {
  border-left-color: var(--uip-color-orange);
}

///Scrolls
.block-editor-inserter__tabs .components-tab-panel__tab-content,
.interface-interface-skeleton__content {
  &::-webkit-scrollbar {
    width: 1em;
  }
  &::-webkit-scrollbar-track {
    background-color: var(--uip-color-base-1);
    border-radius: var(--uip-border-radius);
  }
  &::-webkit-scrollbar-thumb {
    background-color: var(--uip-color-base-2);
    border: 2px solid var(--uip-color-base-1);
    border-radius: var(--uip-border-radius);
  }
}

.select2-container {
  z-index: 999999;
  filter: grayscale(1) invert(1);
  .select2-search__field {
    filter: grayscale(1) invert(1);
  }
}

body {
  --wp--preset--color--black: #000000;
  --wp--preset--color--cyan-bluish-gray: #abb8c3;
  --wp--preset--color--white: var(--uip-color-base-0);
  --wp--preset--color--pale-pink: #f78da7;
  --wp--preset--color--vivid-red: #cf2e2e;
  --wp--preset--color--luminous-vivid-orange: #ff6900;
  --wp--preset--color--luminous-vivid-amber: #fcb900;
  --wp--preset--color--light-green-cyan: #7bdcb5;
  --wp--preset--color--vivid-green-cyan: #00d084;
  --wp--preset--color--pale-cyan-blue: #8ed1fc;
  --wp--preset--color--vivid-cyan-blue: #0693e3;
  --wp--preset--color--vivid-purple: #9b51e0;
  --wp--preset--color--base: #ffffff;
  --wp--preset--color--contrast: #000000;
  --wp--preset--color--primary: #9dff20;
  --wp--preset--color--secondary: #345c00;
  --wp--preset--color--tertiary: #f6f6f6;
}
