// Standard select - Usage: <select data-placeholder="Choose a Country..." className="gds-form-group__chosen--standard-select chosen-select">
.gds-form-group__chosen--standard-select + .chosen-container-single .chosen-single {
    display: block;
    width: 100%;
    padding: $input-padding-md;
    font-size: $font-size;
    line-height: 1;
    letter-spacing: 0.5px;
    color: $gg-dark-4;
    border-radius: $border-radius;
    height: auto;
    background-color: white;
    box-shadow: inset 0 #{-$cap-size} 0 0 $gg-light-3, inset 0 0 0 1px rgba(0, 0, 0, 0.1);

    &:hover {
        box-shadow: inset 0 #{-$cap-size} 0 0 $primaryColor,
            inset 0 0 0 1px rgba($primaryColor, 0.25);
        background-image: url('data:image/svg+xml;utf8,%3Csvg%20id%3D%22Layer_1%22%20data-name%3D%22Layer%201%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20478.87%20249%22%3E%3Cpath%20d%3D%22M478.85%2C0S264.32%2C233.49%2C255.7%2C242.33s-24.33%2C8.94-32.56%2C0L0%2C0H478.85Z%22%20transform%3D%22translate%280.02%200%29%22%20style%3D%22fill%3A%23#{strip-hash($primaryColor)}%3B%22/%3E%3C/svg%3E');
    }

    &:focus {
        box-shadow: inset 0 #{-$cap-size} 0 0 $primaryColor,
            inset 0 0 0 1px rgba($primaryColor, 0.5);
        background-image: url('data:image/svg+xml;utf8,%3Csvg%20id%3D%22Layer_1%22%20data-name%3D%22Layer%201%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20478.87%20249%22%3E%3Cpath%20d%3D%22M478.85%2C0S264.32%2C233.49%2C255.7%2C242.33s-24.33%2C8.94-32.56%2C0L0%2C0H478.85Z%22%20transform%3D%22translate%280.02%200%29%22%20style%3D%22fill%3A%23#{strip-hash($primaryColor)}%3B%22/%3E%3C/svg%3E');
    }
}

.gds-form-group__chosen--standard-select + .chosen-container-single .chosen-single div b {
    display: none;
}

// Input with tags inside
.gds-form-group__chosen--input-with-tags + .chosen-container-multi .chosen-choices {
    display: block;
    width: 100%;
    padding: $input-padding-md;
    font-size: $font-size;
    line-height: 1;
    border-radius: $input-border-radius;
    letter-spacing: 0.5px;
    color: $gg-dark-4;
    background-image: none;

    // Tags
    .search-choice {
        display: inline-block;

        border: 1px solid $gg-light-2;
        border-radius: $border-radius;
        margin: 0 ($unit * 0.5) ($unit * 0.5) 0;
        padding: 0 ($unit * 0.5);
        overflow: hidden;
        vertical-align: top;
        font-family: $pri-font-regular;
        font-weight: $font-weight-light;
        background-color: transparent;
        background-image: none;
        box-shadow: none;
        height: 26px;
        font-size: ($unit * 0.8);
        line-height: 23px;
        padding-right: ($unit * 2.25);
        color: $gg-dark-1;

        // Close button
        .search-choice-close {
            border: none;
            background-color: transparent !important;
            padding: 0;
            position: absolute;
            top: 0;
            right: 0;
            top: -6px;
            right: -3px;
            transform: scale(0.6);
            width: 40px;
            height: 40px;
            top: -9px;
            right: -7px;
            background-image: url('data:image/svg+xml;utf8,%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%0A%09%20viewBox%3D%220%200%2020px%2020px%22%20preserveAspectRatio%3D%22none%22%20fill%3D%22none%22%20stroke%3D%22%23#{strip-hash($gg-light-4)}%22%20stroke-width%3D%222%22%20stroke-miterlimit%3D%2210%22%3E%0A%20%20%3Cline%20class%3D%22st0%22%20x1%3D%220.9%22%20y1%3D%221%22%20x2%3D%2219.1%22%20y2%3D%2219.2%22%2F%3E%0A%20%20%3Cline%20class%3D%22st0%22%20x1%3D%2219.1%22%20y1%3D%221%22%20x2%3D%220.9%22%20y2%3D%2219.2%22%2F%3E%0A%3C%2Fsvg%3E') !important;
            background-repeat: no-repeat !important;
            background-position: 10px 10px !important;

            &:hover {
                background-image: url('data:image/svg+xml;utf8,%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20100%25%20100%25%22%20fill%3D%22none%22%20stroke%3D%22%23#{strip-hash($primaryColor)}%22%20stroke-width%3D%222%22%20stroke-miterlimit%3D%2210%22%3E%3Cline%20class%3D%22st0%22%20x1%3D%220.9%22%20y1%3D%221%22%20x2%3D%2219.1%22%20y2%3D%2219.2%22%2F%3E%3Cline%20class%3D%22st0%22%20x1%3D%2219.1%22%20y1%3D%221%22%20x2%3D%220.9%22%20y2%3D%2219.2%22%2F%3E%3C%2Fsvg%3E');
                cursor: pointer;
            }

            &:focus {
                outline: none;
            }

            &:before {
                content: '';
                position: absolute;
                top: 0;
                left: -($unit * 0.25);
                width: 1px;
                height: 100%;
                background-color: $gg-light-2;
                pointer-events: none;
            }
        }
    }

    input {
        font-family: $pri-font !important;
        letter-spacing: 0.5px;
    }
}

// Dropdown menu
.chosen-container .chosen-drop {
    border-radius: 0 0 $border-radius $border-radius;
    box-shadow: none;
    border: 1px solid rgba($primaryColor, 0.5);

    // Highlighted item(s)
    .highlighted {
        background-color: $primaryColor;
        background-image: none;
    }
}
