// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
// ┃ This file is part of the Perspective library, distributed under the terms ┃
// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛

:host {
    #attributes-symbols {
        position: relative;
        svg {
            width: 15px;
            height: auto;
            color: var(--icon--color);
            fill: var(--icon--color);
            background: none;
        }

        .toggle-mode.is_column_active {
            margin: 0;
            padding: 0;
        }

        .row-selector {
            flex: 1;
            min-width: 0px;
            .column-selector-column-border {
                min-height: 24px;
            }

            input.column-empty-input {
                padding: 0 4px;
                margin: 0;
                width: 100%;
            }

            .row-selector-errored input {
                border-color: var(--error--color);
            }
        }

        .pairs-list-item .dropdown-width-container {
            flex: 0 1 75px;
        }

        &:before {
            font-size: var(--label--font-size, 0.75em);
            left: 0px;
            padding: var(--column_type--padding, 0px 0px 0px 0px);
            position: absolute;
            margin-top: -15px;
            content: attr(data-label);
        }

        &.pairs-list[data-label] {
            margin-top: 24px;
        }

        .column_name {
            padding: 0;
            margin: 0 8px;
        }

        .symbol-selector-wrapper {
            width: 75px;
        }
    }
}