@import
	url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap')
	;

/* Poznámka pro příští generace: pokud se někdo bude zamýšlet nad tím, proč u některých elementů jsou zvláštní marginy a paddingy, 
je to proto že v návrhu posledního redesignu byly zvláštní rozměry a jinak se mi to nepodařilo napasovat na daný návrh. (SLA) */
body {
	font-family: 'Roboto', sans-serif;
}

.appCanvas {
	margin-bottom: 20px;
	font-family: 'Roboto';
	font-size: 12px;
	color: rgb(0, 60, 105);
	max-width: 1210px;
}

.rozcestnik {
	/* 	width: 970px; */
	
}

h2 {
	font-family: "Lucida Grande", Arial, sans-serif;
	font-size: 24px;
	font-weight: bold;
	color: rgb(0, 157, 204)
}

.jumbotron p {
	font-size: 16px;
}

.jumbotron {
	padding-top: 38px;
	padding-bottom: 38px;
}

.form-control {
	font-size: 14px;
	color: #494949;
	border-radius: 0px;
	-webkit-appearance: unset;
	appearance: auto;
}

.btn {
	border-radius: 0px;
	border: 1px solid #8b8b8b;
	font-weight: bold;
	font-size: 13px;
}

.dropdown-menu {
	font-size: 12px;
}

#pocetPoplatnikuSlider .slider-selection {
	background: rgb(0, 157, 204);
}

.slider-wrapper {
	padding: 15px;
}

.slider-title-min {
	margin-right: 20px;
}

.slider-title-max {
	margin-left: 20px;
}

.uvodni-informace {
	color: #868686;
	text-align: justify;
	padding-left: 5px;
	padding-right: 35px;
	font-size: 15px;
	line-height: normal;
}

.uvodni-informace strong {
	color: #3e3f41;
}

.form-horizontal {
	color: #616263;
}

.alert-danger {
	background-color: rgb(255, 224, 204);
	color: rgb(0, 60, 105);
	border-color: rgb(255, 177, 128);
	font-weight: bold;
}

.btn-default {
	/* 	color: rgb(255, 255, 255); */
	/* 	background-color: #2e4d88; */
	/* 	width: 100%; */
	font-size: 13px;
	color: #fff !important;
	text-decoration: none;
	border-left: none;
	padding: 8px 15px 8px 15px;
	text-align: left;
	display: inline;
	border: none;
	background-color: #2b4f86;
	background-image: linear-gradient(to left, transparent, transparent 50%, #466697 50%,
		#466697);
	background-position: 100% 0;
	background-size: 200% 100%;
	transition: all .25s ease-in;
	font-weight: bold;
	border-radius: 0px;
}

.btn-default:hover {
	/* 	background-color: rgb(215, 219, 221); */
	/* 	color: rgb(0, 60, 105); */
	text-decoration: none;
	border-left: none;
	cursor: pointer;
	background-position: 0 0;
	color: #fff;
	-webkit-transition: all .35s ease;
	-o-transition: all .35s ease;
	transition: all .35s ease;
}

.btn-default[disabled]:hover {
	color: rgb(0, 60, 105);
	border: 1px solid #8b8b8b;
}

.poplatek, .castka {
	font-weight: bold;
}

.alert-success {
	color: rgb(0, 60, 105);
	background-color: rgb(242, 251, 245);
	border-color: rgb(128, 210, 159);
	font-weight: bold;
}

.date .form-control {
	padding-right: 0px;
}

.buttonWrapper {
	margin-bottom: 10px;
}

/* ----------------- */
/* Hlavicka, paticka */
/* ----------------- */
.horniMenu {
	clear: both;
	font-size: 14px;
	padding-bottom: 20px;
	border-bottom: 4px solid rgb(247, 248, 248);
}

.menuItemSelected {
	border-bottom: 6px solid white;
}

.horniMenu a {
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 21px;
}

.horniMenu a:link, .horniMenu a:visited, .horniMenu a:hover, .horniMenu a:active
	{
	color: rgb(0, 60, 105);
}

.nadpis {
	font-family: Arial, "Lucida Grande", Verdana, sans-serif;
	font-size: 16px;
	font-weight: bold;
	padding-top: 5px;
	padding-left: 15px;
	float: left;
}

.logo {
	float: left;
	height: 100px;
	padding-left: 15px;
	padding-top: 3px;
}

.cards {
	text-align: right;
	overflow: visible;
	height: 100px;
}

#foot {
	background-color: rgb(247, 248, 248);
	color: rgb(0, 60, 105);
	text-align: right;
	/*margin-bottom: 1em;*/
	padding: 0.750em 0 0 0;
	position: relative;
	min-height: 70px;
}

#foot #logo {
	font-size: 10px;
	top: 0em;
	position: absolute;
	right: 0;
	padding-right: 10px;
}

#footer-text {
	margin-top: 10px;
}

#foot #portal-footer2, #foot #portal-footer {
	position: relative;
}

#foot #portal-footer2 {
	margin-top: 0;
}

#foot #portal-footer2 img {
	position: absolute;
	right: 0;
	top: 3.5em;
}

.slider.slider-horizontal {
	width: 100%;
	height: 20px;
}

.rozcestnik-image {
	background-color: aqua;
	height: 170px;
	width: 170px;
}

.jazyk {
	text-align: right;
}

.col-centered {
	float: none;
	margin-right: auto;
	margin-left: auto;
}

.lang {
	height: 32px;
}

.lang ul {
	margin-top: 0;
	margin-bottom: 0;
}

.lang ul li {
	display: inline;
	margin-top: 0;
	margin-bottom: 0;
}

.obvodyForm {
	margin-top: 15px;
}

.platby {
	margin-top: 10px;
	padding-top: 38px;
	padding-bottom: 38px;
}

.obvodyNadpis {
	margin-top: 38px;
	margin-bottom: 38px;
}

@media screen and (max-width: 992px) {
	.appCanvas {
		width: unset;
	}
	.cards {
		display: none;
	}
	.rozcestnik {
		width: unset;
	}
	.form-control-margin {
		margin-bottom: 10px !important;
	}
	.form-control {
		margin-bottom: 10px;
	}
	.input-group-text {
		margin-bottom: 10px;
	}
	.input-group {
		margin-bottom: 10px;
	}
	#foot {
		min-height: 120px;
	}
	#foot #portal-footer2 img {
		top: 7.5em;
	}
	.kcLabel {
		padding-top: 0.5em;
	}
	.logo {
		padding-left: 10px;
	}
	.nadpis {
		position: absolute;
		top: 10px;
	}
}

.castkaRozsirenyPredpis {
	width: 115px;
	display: inline;
	padding: 3px 11px;
	font-size: 17px;
}

.prepocitatRozsirenyPredpis {
	width: 100px !important;
}

.zaplatitRozsirenyPredpis {
	width: 130px !important;
	text-align: center !important;
}

.td200RozsirenyPredpis {
	width: 200px;
}

.td290RozsirenyPredpis {
	width: 295px;
}

.rozsirenyPredpis .table tbody tr td, .rozsirenyPredpis .table tbody tr th
	{
	border-top: unset;
	vertical-align: middle;
}

.centered {
	text-align: center;
}

.align-right {
	text-align: right;
}

.align-left {
	text-align: left;
}

.rozsirenyPredpis {
	border-top: 1px solid rgba(0, 0, 0, 0.25);
	margin-left: 16px;
	font-size: 15px;
	line-height: 19px;
	padding-bottom: 3px;
}

.rozsirenyPredpis b {
	color: #3e3f41;
}

.rozsirenyPredpisTableWrapper {
	margin-top: 10px;
	margin-bottom: 20px;
}

.rozsirenyPredpisTableWrapper input {
	text-align: right;
}

.rozsirenyPredpisTableWrapper .row {
	margin: 0;
	padding: 21px 39px;
	padding-right: 55px;
}

.rozpisErrorMessage {
	display: block;
	margin-top: 10px;
	color: red;
}

.tablePredpisy {
	margin-bottom: 20px;
	font-size: 14px;
}

.tableErrorMessage {
	margin-bottom: 0px;
}

.trGreyLine {
	border-top: 1px solid #eee;
}

.pageErrorMessage {
	color: red;
	margin-top: 10px;
}

.align-vertical {
	vertical-align: middle !important;
}

.form-control-margin {
	margin-bottom: 20px;
}

.QRCodePlatbaInfo {
	width: 60%;
	float: left;
}

.QRCodePlatbaInfo div:nth-child(odd) {
	float: left;
	clear: both;
	width: 50%;
}

.QRCodePlatbaInfo div:nth-child(even) {
	float: left;
}

.QRCodePlatbaInfo div:nth-last-child(1), .QRCodePlatbaInfo div:nth-last-child(2)
	{
	margin-top: 50px;
}

.QRCodePlatbaButton {
	float: left;
	width: 40%;
}

.QRCodePlatbaModalContent .modal-footer {
	text-align: left !important;
	clear: both;
}

/*QR platba - close button*/
.close:hover {
	background-color: transparent !important;
	opacity: 1 !important;
}

.buttonQRCodePlatba {
	width: 115px !important;
	margin-right: 15px;
}

.buttonQRCodePlatba, .buttonQRCodePlatba:active {
	background: url("../img/qr-small.png") 5px 5px no-repeat;
	background-size: 20px 20px;
	background-color: rgb(0, 165, 63);
	padding-left: 20px;
}

.buttonZaplatit, .buttonZaplatit:active {
	background: url("../img/cards-small.png") 5px 5px no-repeat;
	background-size: 20px 20px;
	background-color: rgb(0, 165, 63);
	padding-left: 20px;
	line-height: 20px;
}

.obchpod {
	float: left;
	margin: 15px 0 15px 60px;
}

#cookie {
	text-align: right;
	background-color: rgb(247, 248, 248);
	color: rgb(0, 60, 105);
	margin-bottom: 1em;
	position: relative;
	padding-bottom: 5px;
	font-size: 10px;
}

.cookie-p {
	text-align: right;
	font-size: 10px;
	padding-right: 10px;
}

.cookieConsent-url, .cookieConsent-url:visited, .cookieConsent-url:active
	{
	cursor: pointer;
	color: rgb(0, 60, 105);
	text-decoration: underline !important;
}

.tableSazby table {
	width: 100%;
}

.tableSazby table, .tableSazby th, .tableSazby td {
	border: 1px solid black;
	margin: 20px;
	padding: 5px;
	text-align: center;
}

.tableOsoby table {
	width: 100%;
}

.tableOsoby table, .tableOsoby th, .tableOsoby td {
	margin: 20px;
	padding: 5px;
	text-align: center;
}

.tableOsoby select {
	width: auto;
	margin: auto;
}

/*#zaplaceni-panel {
	border: 1px solid #d0d0d0;
	background-color: #f7f8f8;
	padding: 15px 30px 10px 15px;
	margin-bottom: 40px;
	display: none;
}

#zaplaceni-panel p {
	padding-left: 15px;
}

#zaplaceni-panel .row {
	margin-top: 20px;
	margin-bottom: 20px;
}*/
.zaplaceni-panel-nadpis {
	text-transform: uppercase;
	font-weight: bold;
}

.zaplatitRozsirenyPredpis {
	width: 150px !important;
}

.zaplaceni-panel-nadpis {
	font-weight: bold;
	padding: 10px 0 10px 25px;
	text-transform: uppercase;
}

.buttonZpetWrapper {
	text-align: right;
}

/* tabulka LogViewer */
.logViewerTable .table tbody {
	border-bottom: 1px solid #2b4f86;
}

.logViewerTable .table th input {
	/* Display each input on its own line */
	display: block;
	/* Add margin for spacing */
	margin: 10px auto;
	/* Center the input horizontally */
	text-align: center;
	/* Set width to fit within the table cell */
	width: 100%;
}

.logViewerTable .table tr th {
	font-size: 12px;
	color: #777777;
	border-bottom: 1px solid #2b4f86;
	font-weight: normal;
	padding: 10px 20px 10px 20px;
	padding-right: 10px;
	background-color: #ecf2f7;
	white-space: nowrap;
}

.logViewerTable .table tr th a svg.icon-sort {
	width: 10px;
	height: 11px;
	float: right;
	margin-top: 5px;
	fill: #7f8faf;
}

.logViewerTable .table tr td {
	font-size: 15px;
	color: #2b4f86;
	padding: 10px 20px 12px 20px;
	background-color: #f8f8f8;
	border: none;
}

.logViewerTable .table tr:nth-child(even) td {
	background-color: #fff !important;
}

.logViewerTable .table tr td:hover {
	color: #2b4f86;
}

.logViewerTable .table tr td svg {
	width: 15px;
	height: 15px;
	margin: 0 0 0 0;
	color: #2b4f86;
}

.logViewerTable .table tr td a {
	color: #2b4f86;
}

.logViewerTable .table tr td a:hover {
	text-decoration: none;
	color: #2b4f86;
}

.logViewerTable .table tr td a:hover td {
	text-decoration: none;
	color: #2b4f86;
}

#logViewerTable tr.bila-hlavicka th {
	background-color: #fff !important;
}

#log-viewer-modal-body pre {
	outline: 1px solid #ccc;
	padding: 5px;
	margin: 5px;
}

#log-viewer-modal-body .string {
	color: green;
}

#log-viewer-modal-body .number {
	color: darkorange;
}

#log-viewer-modal-body .boolean {
	color: blue;
}

#log-viewer-modal-body .null {
	color: magenta;
}

#log-viewer-modal-body .key {
	color: red;
}

@media screen and (max-width: 767px) {
	.poplatek-symboly-wrapper div, .castka-wrapper div {
		position: unset;
	}
}

@media screen and (max-width: 992px) {
	.obchpod {
		float: right;
		margin-top: 45px;
		margin-right: 10px;
	}
}

.oblast-wrapper {
	padding: 10px;
}

.oblast-wrapper a {
	text-decoration: none;
}

.rozcestnik-item {
	background-color: #edf2f8;
	width: 100%;
	height: 100%;
	display: flex; /* Aktivace flexboxu */
	flex-direction: column; /* Uspořádání prvků do sloupce */
	align-items: center; /* Horizontální zarovnání na střed */
	justify-content: center; /* Vertikální zarovnání na střed */
	text-align: center; /* Pro jistotu zarovná text */
	transition: background-color 0.3s ease, color 0.3s ease, fill 0.3s ease;
	/* Přechod pro barvy */
	padding: 15px;
}

.oblast-wrapper a:hover .rozcestnik-item {
	background-color: #d7e4ed; /* Barva pozadí při najetí myší */
}

.oblast-wrapper a:hover .rozcestnik-item svg {
	fill: #2b4f86; /* Změna barvy SVG při najetí myší */
}

.rozcestnik-item svg {
	width: 100px;
	height: 100px;
	fill: #7e8fac;
	color: #7e8fac;
	margin-bottom: 10px; /* Mezera mezi SVG a textem */
	transition: fill 0.3s ease;
}

.rozcestnik-title {
	font-size: 15px;
	color: #2b4f86;
	padding: 0 30px; /* Odstranění nadbytečných okrajů */
	transition: fill 0.3s ease;
}

.input-form-wrapper {
	background-color: #edf2f8;
	padding: 15px;
}

.input-form-wrapper .row {
	margin: 15px;
}

.input-label {
	text-align: right;
	padding: 6px;
	color: #595a5b;
	font-size: 15px;
	font-weight: bold;
}

.uvodni-informace-title {
	color: #c41c1c;
	text-transform: uppercase;
	font-size: 24px;
	font-weight: 500;
	padding: 28px 0 23px 0;
}

.input-group-text svg {
	height: 15px;
	width: 15px;
}

.rozpis-predpisu-title {
	padding: 35px;
	padding-left: 50px;
	font-size: 15px;
	background-color: #edf2f8;
}

.rozpis-predpisu-title-nerozuctovano {
	padding-top: 22px;
	padding-left: 10px
}

.nerozuctovaneErrorMessage {
	padding-left: 10px
}

body {
	background-image: url("img/background.png") !important;
}

.kZaplaceniFormWrapper {
	margin-left: 16px;
	font-size: 15px;
	line-height: 19px;
	padding-bottom: 3px;
}

.variabilni-symbol-wrapper {
	padding: 16px 0;
	border-top: 1px solid rgba(0, 0, 0, 0.25);
	border-bottom: 1px solid rgba(0, 0, 0, 0.25);
}

.vice-osob-wrapper {
	padding-top: 10px;
}

#vypocitany-poplatek-wrapper {
	padding: 15px 0;
}

#vypocitany-poplatek-wrapper div:last-child {
	text-align: left;
}

.toast-progress-bar {
	width: 100%;
	height: 3px;
	background-color: #d8f0d8;
}

.toast-progress-bar-slider {
	height: 100%;
	background-color: #91ed91;
}

.toast-progress-bar--error {
	background-color: #f0dfd8;
}

.toast-progress-bar--error .toast-progress-bar-slider {
	background-color: #e8a082;
}

.toast-progress-bar--info {
	background-color: #cfe2ff;
}

.toast-progress-bar--info .toast-progress-bar-slider {
	background-color: #9ac2fc;
}

.status-toast-body {
	text-align: left;
	display: flex;
	align-items: center;
}

.status-toast-body>svg {
	flex-shrink: 0;
	color: #5B5B5B;
	fill: #5B5B5B;
}

.topBorderDivider {
	border-top: 1px solid rgba(0, 0, 0, 0.25);
}

.castecna-platba-wrapper {
	padding: 16px 0;
}

.castka-wrapper {
	padding: 16px 0;
}

.btn-success {
	background-color: rgb(0, 165, 63);
	background-image: linear-gradient(to left, transparent, transparent 50%, #198754 50%, #198754);
}

.btn-success:hover {
	color: #fff;
	-webkit-transition: all .35s ease;
	-o-transition: all .35s ease;
	transition: all .35s ease;
}