@import 'Variables';
@import './mixins/breadcrumb';

.CoveoResultsFiltersPreferences {
  .coveo-title {
    display: inline-block;
  }
  .coveo-choice-container {
    margin-bottom: 2px;
    padding: 0;
    @include display(flex);
    @include align-items(center);
    width: 100%;
    .coveo-checkbox-span-label {
      @include flex-grow(1);
    }
    .coveo-section {
      display: inline-block;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      padding-left: 10px;
      line-height: 30px;
      height: 30px;
    }
    .coveo-section-tab,
    .coveo-section-expression {
      padding-top: 2px;
    }
    .coveo-section-input {
      width: 20%;
    }
    .coveo-section-tab {
      width: 20%;
    }
    .coveo-section-expression {
      width: 45%;
    }
    .coveo-section.coveo-section-input {
      .coveo-input-icon.coveo-selected:before {
        bottom: 7px;
      }
    }
  }
  .coveo-advanced-filters {
    @include defaultRoundedBorder();
    display: inline-block;
    margin-bottom: 10px;
    padding: 6px 5px;
    &:hover {
      cursor: pointer;
    }
  }
  .coveo-online-help {
    @include clickable();
    float: right;
    width: 30px;
    height: 30px;
    text-align: right;
    font-weight: bold;
  }
  .coveo-delete {
    margin-left: 10px;
    &:hover {
      cursor: pointer;
    }
  }
  .coveo-delete-svg {
    width: 12px;
    height: 12px;
    .coveo-exclusion-svg {
      fill: $color-red;
    }
  }
  .coveo-edit {
    &:hover {
      cursor: pointer;
    }
  }
  .coveo-edit-svg {
    width: 13px;
    height: 13px;
    color: $color-greyish-teal-blue;
  }
  .coveo-advanced-filters-builder {
    display: none;
    position: relative;
    &.coveo-active {
      display: block;
    }
    form {
      overflow: hidden;
      padding: 10px;
      @include defaultRoundedBorder();
      @include display('flex');
      @include flex-wrap(wrap);
    }
    .coveo-input {
      width: 100%;
      margin-bottom: 10px;
    }
    .coveo-expression {
      @include flex-grow(2);
    }
    .coveo-caption,
    .coveo-expression {
      > div {
        height: 100%;
        width: 100%;
      }
    }
    .coveo-close-and-save {
      .coveo-save {
        @include clickable();
        position: absolute;
        top: 6px;
        right: 30px;
      }
      .coveo-close {
        @include clearButton('&');
        position: absolute;
        top: 6px;
        right: 10px;
      }
    }
    .coveo-save-svg {
      width: 14px;
      height: 12px;
      .coveo-hook-svg {
        fill: $color-greyish-teal-blue;
      }
    }
    .coveo-tab {
      min-height: 100px;
      width: 100%;
      optgroup {
        padding-left: 10px;
      }
    }
    input[type='submit'] {
      display: none;
    }
  }
}

.coveo-results-filter-preferences-breadcrumb {
  .coveo-title {
    @include breadcrumb-title();
  }
  .coveo-value {
    @include breadcrumb-value();
    .coveo-clear {
      @include breadcrumb-value-clear();
    }
  }
}
