/* initial status */
.layer {
    transition: all 240ms ease;
}

.layer.transparent {
    opacity: 0.5;
}

/* selected status */
.layer,
.layer:selected {
    background-color: @base_color;
}

.layer:selected {
    box-shadow: inset 4px 0 0 @primary;
}

.layer:selected image,
.layer:selected button {
    background-color: transparent;
    color: @fg_color;
}

/* zebra */
.layer.even,
.layer.even:focus,
.layer.even:selected {
    background-color: shade (@bg_color, 1);
}

/* Hovered */
.layer.hovered:not(:selected),
.layer.even.hovered:not(:selected) {
  box-shadow: inset 0 0 0 2px @highlight;
}

/* label */
.layer label,
.layer:selected label {
    color: @fg_color;
    padding: 8px 0;
}

/* actions */
.layer-action {
    border: none;
    background: transparent;
    padding: 0 2px;
    opacity: 0;
    box-shadow: none;
}

.layer.hover > grid > .layer-action,
.layer.hover > grid > grid > .layer-action {
    opacity: 0.5;
}

.layer.hover > grid > .layer-action:hover,
.layer-action:hover {
    opacity: 1;
}

.layer-action.show {
    opacity: 0.5;
}

.layer-action image,
.layer-action {
    color: @fg_color;
}

/* revealer */
.layer .revealer-button {
    border-bottom: none;
}

.revealer-button {
    padding: 0 8px;
    border-radius: 0;
    border: none;
    box-shadow: none;
    background: transparent;
}

.revealer-button image {
    transition: all 160ms ease-in-out;
}

.revealer-button.closed image {
    -gtk-icon-transform: rotate(-90deg);
}

/* group */
.group-container {
    background-color: @bg_color;
}

.group-container .layer {
    padding-left: 15px;
}

/* drag and drop */
.grid-motion {
    background-color: @primary;
}
