@import 'color';

.blocklyTreeRow {
    box-shadow: inset 0 -0.063em 0 0 #dedede;
}

.blocklyText {
    fill: $black !important;
}

.blocklyTreeSelected .blocklyTreeLabel {
    color: $white !important;
}

.blocklyTreeRow.blocklyTreeSelected .blocklyTreeIcon.blocklyTreeIconOpen, 
.blocklyTreeRow.blocklyTreeSelected .blocklyTreeIcon.blocklyTreeIconClosedLtr {
    filter: invert(100%);
}

.blocklyTreeIcon.blocklyTreeIconOpen {
    background-image: url(../image/down-arrow.svg) !important;
    background-position: -0.188em -0.375em !important;
}

.blocklyTreeIcon.blocklyTreeIconClosedLtr {
    background-image: url(../image/down-arrow.svg) !important;
    background-position: -0.188em -0.375em !important;
}

.blocklyTreeRow.blocklyTreeSelected {
    background-color: #2a3052 !important;
}

.blocklyTreeRow:not(.blocklyTreeSelected):hover {
    background-color: $brand-dark-gray !important;
}

.blocklyToolboxDiv .blocklyTreeRow {
    color: $black;
}

.blocklyEditableText tspan {
    fill: $black !important;
}

.blocklyEditableText rect {
    fill-opacity: 1 !important;
}

.blocklyFlyoutBackground {
    fill: $white !important;
    fill-opacity: 1 !important;
    stroke: $brand-dark-gray;
    stroke-width: 0.063em;
}

.blocklyToolboxDiv {
    background-color: $brand-gray !important;
    border-width: thin;
    color: $brand-dark-gray;
    border-right: 0.063em solid;
    min-width: 11em;
}

.blocklyIconShape {
    fill: #2a3052 !important;
}

.blocklyIconGroup:not(:hover),
.blocklyIconGroupReadonly {
    opacity: 1 !important;
}

.blocklyScrollbarVertical,
.blocklyScrollbarHorizontal {
    display: none;
}

.blocklyTreeRow {
    margin-bottom: 0px !important;
    height: 1.9em !important;
    padding-top: 0.250em;
}

.blocklyToolboxDiv {
    z-index: 99 !important;
    left: -100%;
    overflow-x: hidden !important;
}

.blocklySvg {
    position: absolute;
}

.blocklyMainBackground {
    stroke: none;
}
