@import '../../shared-styles/index';

:host {
    display: block;
}

.nx-toggle-button {
    display: block;
    cursor: pointer;
    appearance: none;
    border: none;
    outline: none;
    background: none;
    padding: 0;
    line-height: nx-line-height(2xs);
    height: nx-line-height(2xs);

    .nx-toggle-button__icon {
        transform: rotateZ(0);
        transition: transform 200ms ease;
        color: v(expandable-table-arrow-icon-color);
    }

    &.is-expanded {
        .nx-toggle-button__icon {
            transform: rotateZ(-180deg);
        }
    }

    &::-moz-focus-inner {
        border: 0;
    }
}

.nx-toggle-button.cdk-keyboard-focused {
    border-radius: nx-border-radius(s);
    @include focus-style;
}
