@define-color music_entry_tag_bg #3465a4;
@define-color music_entry_tag_fg @theme_base_color;

@binding-set unbind-ctrl-space {
    unbind "<ctrl>space";
}

/* Use widget for libgd classes, since they aren't updated
   to gtk+-3.20 css naming yet. */
flowbox, treeview, widget {
    -gtk-key-bindings: unbind-ctrl-space;
}

.discsongsflowbox > flowboxchild {
    padding: 0px;
}

.cover{
    padding-left:24px;
}
.title{
    padding-left:24px;
}

.side-panel:dir(ltr) {
    border-width: 0 1px 0 0;
}

.side-panel:dir(rtl) {
    border-width: 0 0 0 1px;
}

.side-panel .view {
    background-color: mix(@theme_fg_color, @theme_bg_color, 0.9);
}

.side-panel .view:dir(ltr) {
    box-shadow: inset -10px 0 5px -10px alpha(black, 0.25);
}

.side-panel .view:dir(rtl) {
    box-shadow: inset 10px 0 5px -10px alpha(black, 0.25);
}

.side-panel .view:selected {
    background-color: mix(@theme_fg_color, @theme_bg_color, 0.5);
}

.songs-list {
    box-shadow: inset 0 -1px shade(@borders, 1.30);
    background-color: @theme_bg_color;
}

/* We use background-image as a workaround on the StarImage widget to
   enable transitions between the non-starred and starred icons. */
.star {
    background-image: -gtk-icontheme('non-starred-symbolic');
    color: shade(@theme_bg_color, 0.8);
    transition: 100ms linear;
}

.star:hover {
    color: shade(@theme_bg_color, 0.5);
}

.star:selected {
    background-image: -gtk-icontheme('starred-symbolic');
    color: @theme_selected_bg_color;
    transition: 100ms linear;
}

.content-view { background-color: @theme_bg; }

.music-entry-tag {
    background-image: none;
    background-color: @music_entry_tag_bg;
    color: @music_entry_tag_fg;

    border-radius: 4px;
    border-width: 0;

    margin: 2px;
    padding: 4px;
}

.music-entry-tag:hover {
    background-color: shade(@music_entry_tag_bg, 1.10);
    color: @music_entry_tag_fg;
}

.music-entry-tag.button,
.music-entry-tag.button:hover,
.music-entry-tag.button:active,
.music-entry-tag.button:active:hover {
    background-color: transparent;
    background-image: none;
    box-shadow: none;
    border-image: none;
    border-width: 0;
}
