/**
* Copyright Aquera Inc 2025
*
* This source code is licensed under the BSD-3-Clause license found in the
* LICENSE file in the root directory of this source tree.
*/

import { css } from 'lit';

/**
 * OptionHeader CSS
 */
export const styles = css`
	.option-group-header {
		height: 40px;
		display: flex;
		align-items: center;
		padding: 0px 12px;
		background-color: var(--nile-colors-dark-200);
		color: var(--nile-colors-dark-900);
		font-feature-settings: 'liga' off, 'clig' off;
		font-family: 'colfax-medium';
		font-size: 12px;
		font-weight: 500;
		width: 100%;
		box-sizing: border-box;
		justify-content: space-between;
	}

	.content-container {
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.gap-18px {
		gap: 14px;
	}

	.option-group-prefix,
  .option-group-suffix {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
  }

  .option-group-prefix::slotted(*) {
    margin-inline-end: 0.5rem;
  }

  .option-group-suffix::slotted(*) {
    margin-inline-start: 0.5rem;
  }

  :host(.nile-group-hidden)::part(option-group-header) {
	display: none !important;
  }

.option-group-header {
  z-index: 2;
}
:host([sticky]) .option-group-header {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--nile-colors-dark-200);
}
:host([sticky][search-enabled]) .option-group-header {
  top: 46px;
}

`;

export default [styles];