@use 'libs/components/theme/src/lib/styles/variables' as *;

.sky-list-toolbar-search-wrapper {
  display: flex;

  ::ng-deep {
    .sky-search-dismiss-absolute {
      padding: 0;
      position: static;
    }

    .sky-search-container {
      position: relative;
      height: 100%;
    }

    sky-search {
      flex: 1 1 auto;
    }

    sky-list-toolbar-search-actions {
      flex: 0 0 auto;
      z-index: 1;
    }
  }
}

.sky-list-toolbar-container {
  ::ng-deep {
    .sky-toolbar-section-items {
      sky-toolbar-item {
        flex: 0 1 auto;
        align-self: flex-start;
      }
    }
  }
}

.sky-list-toolbar-search {
  ::ng-deep {
    .sky-toolbar-section {
      padding-top: 0;
    }

    .sky-toolbar-section-items {
      display: block;
      width: 100%;
    }

    .sky-toolbar-item {
      margin: 0;
    }

    .sky-toolbar-container,
    .sky-search-dismiss-absolute {
      background-color: $sky-background-color-neutral-light;
    }

    input[type='text']:disabled,
    .sky-search-btn:disabled {
      background-color: $sky-background-color-disabled;
      opacity: 1;
    }
  }
}

.sky-list-toolbar-container {
  ::ng-deep sky-toolbar-item[sky-toolbar-id='sort-selector'] .sky-toolbar-item {
    margin-right: 0;
  }

  ::ng-deep sky-checkbox {
    position: relative;
    top: -2px;
  }
}
