:block(attach):mod(theme islands) {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

    display: inline-block;

    white-space: nowrap;

    :block(attach):elem(control) {
        position: absolute;
        z-index: 2;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;

        width: 100%;
        height: 100%;
        margin: 0;

        cursor: pointer;

        opacity: 0;
    }

    :block(attach):elem(file),
    :block(attach):elem(no-file) {
        display: inline;

        margin-left: 0.4em;
    }

    :block(attach):elem(clear) {
        display: inline-block;

        margin-left: 0.4em;

        cursor: pointer;
        transition: opacity 0.1s ease-out;
        vertical-align: middle;

        opacity: 0.3;
        background: center no-repeat;

        &:hover {
            opacity: 1;
        }
    }

    &:block(attach):mod(disabled) {
        :block(attach):elem(file),
        :block(attach):elem(no-file) {
            opacity: 0.6;
        }
    }

    &:block(attach):mod(size s) { font-size: 13px; }
    &:block(attach):mod(size m) { font-size: 13px; }
    &:block(attach):mod(size l) { font-size: 15px; }
    &:block(attach):mod(size xl) { font-size: 18px; }

    &:block(attach):mod(size s) :block(attach):elem(clear),
    &:block(attach):mod(size m) :block(attach):elem(clear) {
        width: 10px;
        height: 14px;

        background-image: url(../../theme/_islands/clear_size_s.svg);
    }

    &:block(attach):mod(size l) :block(attach):elem(clear),
    &:block(attach):mod(size xl) :block(attach):elem(clear) {
        width: 14px;
        height: 14px;

        background-image: url(../../theme/_islands/clear_size_l.svg);
    }

    :block(button) {
        position: relative;

        &:elem(text) {
            display: inline;

            z-index: 1;
        }
    }
}
