/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at https://mozilla.org/MPL/2.0/. */

.sidebar-panel {
  font: menu;

  > * + * {
    margin-top: var(--space-xlarge);
  }

  > sidebar-panel-header + * {
    margin-top: var(--space-medium);
  }
}

.customize-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  -moz-context-properties: fill;
  fill: currentColor;
  color: currentColor;

  .customize-close-button::part(button) {
    background-image: url("chrome://global/skin/icons/close-12.svg");
  }
}

.icon {
  -moz-context-properties: fill;
  fill: currentColor;
  width: var(--icon-size-default);
  height: var(--icon-size-default);
}

.extensions {
  display: flex;
  flex-direction: column;
  margin-top: var(--space-small);
  border: 0.5px solid var(--panel-separator-color);
  border-radius: var(--border-radius-medium);
  background-color: var(--toolbar-bgcolor);
  color: var(--toolbar-color);
  padding-inline: var(--space-medium);
}

.extension-item {
  display: flex;
  gap: var(--space-small);
  padding-block: var(--space-medium);
  box-sizing: border-box;

  &:not(:last-of-type){
    border-bottom: 0.5px solid var(--panel-separator-color);
  }
}

.customize-extensions-heading {
  margin: 0;
  font-weight: var(--font-weight-bold);
}

moz-radio-group,
moz-fieldset {
  display: block;

  &::part(inputs) {
    border: 0.5px solid var(--panel-separator-color);
    border-radius: var(--border-radius-medium);
    background-color: var(--toolbar-bgcolor);
    color: var(--toolbar-color);
    gap: 0;
    padding-inline: var(--space-medium);
  }
}

moz-radio,
moz-checkbox {
  display: flex;
  padding-block: var(--space-medium);
  box-sizing: border-box;

  &:not(:last-of-type) {
    border-bottom: 0.5px solid var(--panel-separator-color);
  }

  &::part(label) {
    width: 100%;
  }
}

#manage-settings {
  display: flex;
  align-items: center;
  gap: var(--space-large);
}

.customize-group {
  margin-block-end: var(--space-xlarge);
}