.kbq-accordion-trigger {
    display: flex;
    flex-direction: row;
    align-items: center;

    background: transparent;
    border: none;
    outline: none;

    & .kbq-accordion-trigger__icon {
        box-sizing: initial;

        align-self: flex-start;

        padding: var(--kbq-size-xxs);

        transition: transform 300ms ease-out;
    }

    & .kbq-accordion-trigger__badge,
    & .kbq-accordion-trigger__caption {
        margin-top: var(--kbq-size-xxs);
        margin-right: var(--kbq-size-s);
    }

    & .kbq-accordion-trigger__action {
        padding: var(--kbq-size-xxs) var(--kbq-size-xxs) var(--kbq-size-3xs);
        margin-bottom: calc(-1 * #{var(--kbq-size-3xs)});
    }

    &:hover:not([data-disabled='true']) {
        cursor: pointer;

        & .kbq-accordion-trigger__icon {
            color: var(--kbq-accordion-item-states-hover-icon-color);
        }
    }

    &.kbq-accordion-trigger_fill {
        padding: var(--kbq-accordion-size-item-header-variant-fill-padding);

        &[data-state='open'] > .kbq-accordion-trigger__icon {
            transform: rotate(90deg);
        }
    }

    &.kbq-accordion-trigger_hug {
        flex-direction: row-reverse;
        justify-content: flex-end;

        padding: var(--kbq-accordion-size-item-header-variant-hug-padding);

        &[data-state='open'] > .kbq-accordion-trigger__icon {
            transform: rotate(90deg);
        }
    }

    &.kbq-accordion-trigger_hug-space-between {
        flex-direction: row-reverse;
        justify-content: space-between;

        padding: var(--kbq-accordion-size-item-header-variant-hug-padding);

        &[data-state='open'] > .kbq-accordion-trigger__icon {
            transform: rotate(-180deg);
        }
    }

    &[data-disabled='true'] {
        & .kbq-accordion-trigger__icon {
            color: var(--kbq-accordion-item-states-disabled-icon-color) !important;
        }
    }
}

button.kbq-accordion-trigger {
    flex: 1;
}