@import url(https://js.arcgis.com/4.25/@arcgis/core/assets/esri/themes/light/main.css);
:root {
	--selected-button-bg-color: #005799;
}
html,
body,
#viewDiv {
	padding: 0;
	margin: 0;
	height: 100%;
	width: 100%;
	background: rgba(50, 50, 50);
}

#overlay {
	position: fixed;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: rgba(24, 24, 24, 0.8);
	left: 0;
	top: 0;
	min-width: 100%;
	min-height: 100%;
	z-index: 100;
}

#opozorilaUporabniku {
	display: none;
	position: fixed;
	top: 50%;
	left: calc(50% - 60px);
	font-size: 14px;
	width: 100px;
	background-color: #000000b3;
	color: white;
	padding: 10px;
	border: 1px solid black;
	border-radius: 5px;
}

.overlay-content {
	font-family: "Avenir Next W00", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: .9rem;
	width: 45%;
	min-width: 300px;
	color: whitesmoke;
	padding: 2rem;
	border: 2px solid #eaeaea;
	border-radius: .25rem;
}

.button-container {
	text-align: center;
}

.btn-disclaimer-agree:hover {
	color: #212529;
	background-color: #e2e6ea;
	cursor: pointer;
	border-color: #dae0e5;
}

.btn-disclaimer-agree {
	font-family: "Avenir Next W00", "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #212529;
	background-color: white;
	border-color: white;
	display: inline-block;
	font-weight: 400;
	color: #212529;
	text-align: center;
	vertical-align: middle;
	border: 1px solid transparent;
	padding: .25rem .5rem;
	font-size: 1rem;
	line-height: 1.5;
	border-radius: .25rem;
}

#topMenu {
	/* flex: 2; */
	position: absolute;
	top: 0%;
	height: 50px;
	background-color: #ececec;
	border-radius: 0 0 1.5rem 0;
	z-index: 99;
}

#topMenu ul li {
	float: left;
	text-align: center;
	padding: 0.5em;
	list-style-type: none;
}

/* #topMenu ul li:nth-child(2n) {
	padding-right: 3em;
} */

#topMenu ul>li>span, #topMenu ul>li>a {
	color: black;
	font-size: .9rem;
	font-family: "Avenir Next W00", "Helvetica Neue", Helvetica, Arial, sans-serif;
	line-height: 1.3rem;
	text-decoration: none;
	cursor: pointer;
}

#topMenu ul>li>span, #topMenu ul>li>a:hover {
	text-decoration: underline;
}

#partnersLogos {
	display: none;
	float: right;
}

/* responsive navigation bar */

#topMenu.responsive-nav {
	background-color: #ececec;
	border-radius: 0;
	width: 100%;
}

/* hide partners logos on small screens */

#topMenu.responsive-nav ul div {
	/* visibility: hidden; */
	visibility: visible;
}

#topMenu.responsive-nav ul {
	padding-left: .5rem;
}

#topMenu.responsive-nav ul>li>a {
	font-size: .8rem;
	line-height: 1rem;
	/* padding: .5rem; */
}


.text-opozorilo {
	text-align: left;
	/* padding: 1rem; */
	font-size: 0.8rem;
}

.fit-image-logo {
	max-height: 40px;
	margin-top: -1.5em;
}

.fit-image-logoMop {
	max-height: 35px;
	margin-top: -1.5em;
}

#projectionsTable {
	display: block;
	min-width: 300px;
	padding: 1em;
	border-radius: .5rem;
	text-align: center;
}

#projectionsTable table th, #projectionsTable table td {
	font-size: .8rem;
}

#layerSelectDiv {
	width: 200px;
	background-color: rgba(255, 255, 255, 0.8);
	padding: .5rem 1rem 0 1rem;
	border-radius: .5rem;
}

#layerSelectDiv span {
	font-size: .8rem;
}

#resultDataContainer {
	display: none;
	width: 600px;
	font-size: 0.8rem;
	/* height: calc(310px + 200px); .results-flex-container + #priporocilaContainerDiv height */
	padding: 5px;
	border: 2px solid #d9d9d9;
	border-radius: 0.5rem;
	background-color: #f1f1f1;
	overflow-y: auto;
	overflow-x: hidden;
}

.results-flex-container {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	height: 300px;
}

#textdataResultsContainer th {
	text-align: left;
}

#textdataResultsContainer th:first-child {
	width: 60%;
}

#chartContainer {
	background-color: #f1f1f1;
}

#splosnoOpozoriloPmp, #splosnoOpozoriloPloskovna, #splosnoOpozoriloLinijska {
	text-decoration: underline;
	cursor: pointer;
}

#poisciParceloDiv {
	display: block;
	min-width: 240px;
	padding: 1em;
	border-radius: .5rem;
}

.main-custom-popup table th {
	font-size: 0.9rem;
	font-weight: 700;
	text-align: left;
	padding-bottom: .5rem;
}

.main-custom-popup table td {
	font-size: 0.9rem;
}

.main-custom-popup table tr td:last-child {
	text-align: center;
}

.esri-expand__content.esri-expand__content--expanded {
	overflow: auto;
	border-radius: .5rem;
	z-index: 10;
}

.priporocilo {
	background-color: #f1f1f1;
	overflow: auto;
}

.priporocilo th, .priporocilo td {
	font-size: .8rem;
	padding: .5rem;
}


#customInfoWindowDiv table th {
	font-size: .8rem;
	padding: .5rem;
}

#customInfoWindowDiv table td {
	font-size: .8rem;
	padding: .5rem;
}

#customInfoWindowDiv table tr th:nth-child(1) {
	min-width: 120px;
}

#customInfoWindowDiv table tr th:nth-child(2) {
	min-width: 130px;
}

#customParcelaWindowDiv {
	background-color: rgba(0, 0, 0, 0.6);
	color: white;
	display: none;
	width: 400px;
	height: 300px;
	border-radius: .5rem;
}

.map-scale {
	display: none;
	padding: 0.5em;
}

#mapScaleDiv {
	background-color: rgba(255, 255, 255, 0.6);
	font-size: .8rem;
	padding: .5rem;
	border-radius: .5rem;
	text-transform: uppercase;

}

#mainMenuDiv {
	width: 230px;
	/* background-color: #005e35; */
	/* color: white; */
	background-color: #ececec;
	color: black;
	padding: 1rem;
	border-radius: 0.5rem;
}

/* hide selection tool in Sketch widget and style polygon sketching button */
.esri-sketch__section {
	margin: 0;
	padding: 0;
}

.esri-sketch__panel.esri-sketch__info-panel {
	display: none;
}

.esri-sketch__tool-section:first-child {
	display: none;
}

/* .esri-sketch__tool-section:nth-child(2) {
	background-color: rebeccapurple!important;
} */

/* #poizvedovanjaDiv {
	background-color: white;
	padding: .5rem;
} */

.queries-toolbar {
	color: black;
	/* padding: 6px 0; */
	box-shadow: none;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	/* justify-content: space-between; */
}

.queries-toolbar svg {
	width: 20px;
	height: 20px;
}

.query-button-container {
	/* background-color: white; */
	background-color: #eef2e4;
}

.query-button-container:last-child {
	border: none;
}

.query-button {
    background: #ececec;
    color: black;
    /* border: 2px solid transparent; */
}

.query-button.active, .query-button:hover {
	background-color: var(--selected-button-bg-color);
	color: white;
    /* border-color: #00619b; */
}

calcite-action {
	--calcite-ui-foreground-1: none;
	--calcite-ui-foreground-2: var(--selected-button-bg-color);
	--calcite-ui-foreground-3: var(--selected-button-bg-color);
	--calcite-ui-text-1: white;
}

:host([active]) .button {
	border: 2px solid black !important;
}

.calcite-theme-light {
	--calcite-ui-foreground-3: #c7c7c7;
}

/* .queries-toolbar .query-button.active svg {
	color: white;
} */

.esri-feature {
	/* background-color: wheat; */
	z-index: 1;
	/* font-size: 0.9em; */
}

.esri-feature h4 {
	display: none;
}

.esri-feature table {
	width: 600px;
	border-collapse: collapse;
	/* font-size: 0.9em; */
	/* background-color: rgba(0, 0, 0, 0.2); */
}

.esri-feature table tbody tr td:first-child {
	background-color: #FFFA9A;
	/* background-color: rgba(255, 250, 154, 0.2); */
	width: 20% !important;
	font-size: 0.8em;
}

.esri-feature table tbody tr td:last-child {
	width: 80%;
	font-size: 0.8em;
}

.parceleTable {
	width: 100%;
}

.parceleTable td:first-child {
	width: 30%;
}

.priporocilaText {
	font-weight: 700;
	text-decoration: underline;
	cursor: pointer;
}


select#cadastralMunicFilterId {
	width: 275px;
	font-family: 'Avenir Next W00';
	font-size: 1em;
}

/*popup styling*/

.esri-view-width-xlarge .esri-popup__main-container {
	/* min-width: 500px; */
	/* min-height: 460px; */
	z-index: 1;
	border-radius: .5rem;
	background-color: #f1f1f1;
}

.esri-ui .esri-popup {
	border-radius: .5rem;
}

table {
	border-collapse: collapse;
}

table td {
	/* font-family: 'Avenir Next W00'; */
	border-collapse: collapse;
	font-size: 1em;
	/* border: 1px solid black; */
	border: none;
	padding: 0.2em;
}

.esri-popup__header-title {
	word-break: keep-all !important;
	font-size: 1rem;
	font-weight: 400;
}


/* disables border in popup menu of parcels */

table.esri-widget__table td {
	border: none;
}

/* basic popup */
.esri-popup__content table tbody tr td:first-child {
	/* max-width: 250px; */
	width: 45%;
	text-align: left;
}

.esri-popup__content table tbody tr td:last-child {
	/* max-width: 250px; */
	width: 55%;
	text-align: center;
}

.priporocilo .notRelevantRiskDegreeStyleClass {
	background-color: rgb(235, 236, 232);
}

.priporocilo .verySmallRiskDegreeErozijaStyleClass {
	background-color: #4d9aff;
}

.priporocilo .verySmallRiskDegreeStyleClass {
	background-color: rgb(38, 115, 0);
}

.priporocilo .smallRiskDegreeStyleClass {
	background-color: rgb(152, 230, 0);
}

.priporocilo .middleRiskDegreeStyleClass {
	background-color: yellow;
}

.priporocilo .highRiskDegreeStyleClass {
	background-color: rgb(255, 204, 0);
}

.priporocilo .veryHighRiskDegreeStyleClass {
	background-color: red;
}


table td.veryHighRiskDegreeStyleClass {
	background-color: red;
}

table td span.notRelevantRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: #ebece8;
	border-radius: .5rem;
	padding: .1rem;
}

table td span.verySmallRiskDegreeErozijaStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: #4d9aff;
	border-radius: .5rem;
	padding: .1rem;
}

table td span.verySmallRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(38, 115, 0);
	border-radius: .5rem;
	padding: .1rem;
}

table td span.smallRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(152, 230, 0);
	border-radius: .5rem;
	padding: .1rem;
}

table td span.middleRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: yellow;
	border-radius: .5rem;
	padding: .1rem;
}

table td span.highRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(255, 204, 0);
	border-radius: .5rem;
	padding: .1rem;
}

table td span.veryHighRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: red;
	border-radius: .5rem;
	padding: .1rem;
}

table td span.seNiObdelanoStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(225, 225, 225);
	border-radius: .5rem;
	padding: .1rem;
}

table td span.ploskovnaSmallRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: yellow;
	border-radius: .5rem;
	padding: .1rem;
}

table td span.ploskovnaMiddleRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(255, 170, 0);
	border-radius: .5rem;
	padding: .1rem;
}

table td span.ploskovnaHighRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: red;
	border-radius: .5rem;
	padding: .1rem;
}

table td span.ploskovnaSeNiObdelanoStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(204, 204, 204);
	border-radius: .5rem;
	padding: .1rem;
}


table td span.linijskaVerySmallRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(0 92 230);
	border-radius: .5rem;
	padding: .1rem;
}

table td span.linijskaSmallRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(255 255 0);
	border-radius: .5rem;
	padding: .1rem;
}

table td span.linijskaMiddleRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(255 170 0);
	border-radius: .5rem;
	padding: .1rem;
}

table td span.linijskaHighRiskDegreeStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(255 0 0);
	border-radius: .5rem;
	padding: .1rem;
}

table td span.linijskaSeNiObdelanoStyleClass {
	display: inline-block;
	width: 5rem;
	text-align: center;
	color: black;
	background-color: rgb(225, 225, 225);
	border-radius: .5rem;
	padding: .1rem;
}

#error-messages {
	background-color: rgb(255, 232, 232);
	border: 1px solid red;
	color: red;
	display: none;
	padding: 0.5em;
	list-style: none;
}

.opozorilo {
	display: block;
	background-color: rgb(255, 232, 232);
	border: 1px solid red;
	color: red;
	padding: 0.5em;
	list-style: none;
}

.obvestilo-stanje-parcel {
	font-size: .7rem;
}

.esri-scale-bar {
	z-index: 0;
}

.esri-legend {
	/* line-height: .4rem; */
	background-color: rgba(255, 255, 255, 0.8);
	max-width: 250px;
}

.esri-legend__service {
	padding-bottom: 0;
}

.esri-legend__layer-caption {
	display: none;
}

/* .esri-widget--button {
	width: 32px;
    height: 32px;
} */

/* responsive design https://developers.arcgis.com/javascript/latest/sample-code/view-breakpoints-css/ */

.esri-view-width-less-than-medium .esri-zoom .esri-widget--button {
	display: none;
}

#layerSelectDiv {
	width: 200px;
	background-color: rgba(255, 255, 255, 0.8);
	padding: .5rem 1rem 0 1rem;
	border-radius: .5rem;
}

#layerSelectDiv span {
	font-size: .8rem;
}

/* #layerSelectId {
	background: none;
} */

#activeLayerOpacitySliderDiv {
	background: none;
}

#dmrOpacityDiv {
	display: none;
	background-color: rgba(255, 255, 255, 0.8);
	padding: .5rem;
	width: 230px;
	border-radius: .5rem;
}

#dmrOpacityDiv span {
	font-size: .8rem;
}

#dmrOpacitySliderDiv {
	width: 100%;
	padding: 0;
	height: 35px;
	background-color: initial;
}

#measurementsToolBar {
	background-color: white;
	padding: .5rem;
}

#measurementsDiv {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}

#measurementsDiv button {
	border-top: none;
	border-right: none;
	border-left: none;
	border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}


/* @media (min-width: 768px) { */
@media (min-width: 540px) {
	#partnersLogos {
		display: block;
	}
}

@media (max-width: 768px) {
	.overlay-content {
		width: 100%;
		font-size: .7rem;
		padding: .5rem;
	}

	/* #topMenu ul li:nth-child(2n) {
		padding-right: 0;
	} */

	#mapScaleSpan {
		text-transform: uppercase;
	}
}

@media (max-width: 1268px) {
	#mapScaleDiv {
		font-size: .6rem;
		width: 500px;
	}
}