:host {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  width: 100%;
  max-width: 100%;
  height: 100%;
  align-items: center;
  align-content: center;
}

:host-context(
    .ag-header-cell.ag-right-aligned-header,
    .ag-header-cell.sky-ag-grid-header-right-aligned
  ) {
  flex-direction: row-reverse;

  .ag-header-cell-label {
    .sky-control-help-container {
      order: 0;
    }

    .ag-header-cell-label-and-icons {
      order: 1;
    }
  }
}

.ag-header-cell-label .ag-header-cell-label-and-icons,
.sky-btn.sky-btn-icon-borderless {
  .ag-header-label-icon,
  .ag-header-menu-icon,
  .ag-header-icon {
    line-height: 0;
    margin-left: var(--sky-margin-inline-sm);
  }
}

button.ag-header-cell-label {
  max-width: 100%;
}

.ag-cell-label-container {
  padding: 0;
  gap: var(--sky-margin-inline-xs);
}

.ag-header-cell-label {
  padding-right: 0;
  padding-left: 0;

  .ag-header-cell-label-and-icons {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    overflow: hidden;
    align-items: center;

    .ag-header-cell-text {
      flex-grow: 0;
      flex-shrink: 1;
    }

    .ag-sort-indicator-container {
      color: var(--ag-header-foreground-color);
      width: initial;
      height: initial;

      &:hover {
        border: none;
      }
    }
  }
}

button {
  cursor: pointer;
  flex-grow: 0;
  flex-shrink: 1;
}
