/* General */
body {
	background-color: white;
}

h2, h3 {
	margin-top: 20px;
}

#tab-tasks .card-header {
	cursor: pointer;
}

#tab-tasks .card-header .row .col-md {
	margin-bottom: 0;
}

#alert-messages-popup {
	margin: 100px auto; /* margin-top is dynamically changed, check loadAndResize() in Javascript for more info */
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	opacity: 0.95;
	padding-right: 5em;
	padding-left: 5em;
	z-index: 2000; /* Above Leaflet map and all it's toolbars */
}

#alert-messages-popup .alert {
	border: 1px solid black;
}

/* main content */
#main {
	padding-top: 25px;
	padding-bottom: 25px;
}

/**
 * Fix for not showing border bottom in nested cards
 * @author https://github.com/ng-bootstrap/ng-bootstrap/issues/2338#issuecomment-509009426
 */
.accordion div.card:only-child {
	border-bottom: 1px solid rgba(0, 0, 0, 0.125);
	border-radius: calc(0.25rem - 1px);
}

/**
 * Workaround: graph is generated by given width and height
 * = if user has disabled showing graph, div is moved out of screen where is generated. If graph should be shown, it is moved back to relative position
 */
#sigma-graph:not(.show) {
	display: block;
	position: absolute;
	top: -5000px;
	width: 1000px;
	height: 500px;
}

#sigma-container {
	width: 100%;
	height: 500px;
}

/**
 * Because of workaround above is moving animation out of screen but there is still waiting till animation is done so we just remove it and toggling is instant
 * @TODO - fix it because animations are awesome!
 */
#sigma-graph.collapsing {
	-webkit-transition: none;
	transition: none;
	display: none;
}

/**
 * @Author: https://stackoverflow.com/a/16768855
 */
.tooltip-inner {
	max-width: 300px;
}

.btn.buy-hint {
	margin-top: 5px;
	color: inherit;
}

button:disabled {
	cursor: not-allowed;
}

.btn.indice-download {
	display: block;
}

.loading {
	text-align: center;
}

/**
 * Disable collapse animations
 * @Author: https://stackoverflow.com/a/22428493/3334403
 */
/*.collapsing {
    -webkit-transition: none;
    transition: none;
    display: none;
}*/
a.nav-link {
	cursor: pointer;
	color: #0056b3;
}

#nav-sign-out a {
	color: inherit;
}

@media (min-width: 768px) {
	#submit-code {
		max-width: 169px;
	}

	#submit-code input {
		max-width: 8rem;
	}
}

#footer {
	text-align: center;
	margin: 1em 0;
}

/**
 * Change colors to dark mode if body has ".dark" class
 * - but do not change print output
 */
/*
@media not print {
    body.dark {
        background-color: black;
        color: #909090;
    }
    body.dark #panel {
        background-color: #303030;
        border-right: 2px solid #303030;
    }
    body.dark #education table tr:nth-child(2n+2):not(:last-child),
    body.dark #experience table tr:nth-child(2n+2):not(:last-child) {
        border-bottom: 2px solid #303030;
    }
    body.dark a {
        color: orange;
    }
    body.dark .progress-bar {
        background-color: orange;
    }
}
*/
