@import '../netopeer-common';
@import '../inventory/inventory.component';
@import './tree.component';

.tab-add,
.tab-reload,
.tab-close {
    cursor: pointer;
    font-weight: bold;
    font-family: monospace;
    font-size: large;
}
.tab-action-first {
    padding-left: 0.3em;
}
.tab-action-last {
    padding-right: 0.5em;
}

.tab-icon {
    vertical-align: middle;
    height: 1em;
}

.tab-add {
    filter: invert(100%);

    &:hover {
        color: $green;
    }
}

.tab-close:hover {
    color: $colorFailureBorder;
}
.tab-reload:hover {
    color: blue;
}

#confignav {
    position: fixed;
    width: 100%;
	background-color: $colorMain;
	padding-left: 1em;
	
	a {
    	cursor: pointer;
		text-decoration: none;
		display: inline-block;
		padding: 0.2em 0em 0.1em 1em;
		color: $colorTextInverse;
		
		&:visited,
		&:link {
			color: inherited;
		}
		&:hover,
		&.active {
			background-color: $colorBackground;
			color: $colorText;
		}
		&active:hover {
			cursor: default;
		}
	}
}

#config-data {
    width: 100%;
}

.item_action_expand,
.item_action_collapse {
    height: 1em;
}

.item_action_collapse:hover {
    color: $red;
}

.item_action_expand:hover {
    color: $green;
}

.modifications-status {
	margin-bottom: 2em;
	margin-right: 2em;
	padding: 0.5em 1em;

	>div {
		position: fixed;
		bottom: 2em;
		right: 2em;
		background-color: $colorChanged;
		border: 2px solid $colorChangedBorder;
        padding: 0 1em;
        div {
            padding: 0.5em 0em;
        }
	}
}

.loading {
    text-align: center;
    margin: auto;
    width: 10em;
    div {
        margin: auto;
        width: 50px;
    }
}