/** matrix layout - zakladni tlacitka a inputy */


/** spolecne nastavení */

body {
	font-size: 13px; 
}

/* tlacitka */
.btnStorno,
.btnNew,
.btnRemove,
.btnSave,
.btnPrint,
.btnSearch,
.btnExtFilter,
.btnClose,
.aBtnStorno,
.aBtnNew,
.aBtnRemove,
.aBtnSave,
.aBtnPrint,
.btn {
	padding: 6px 10px;
	font-size: 14px;
	border: 1px solid var(--btnSaveBorder);
	cursor: pointer;
	vertical-align: top;
	margin: 4px;
	line-height: 16px;
	text-decoration: none;
}

.btn {
	background: var(--btnSaveBg); 
	color: var(--btnSaveFg); 
}


.btnStorno img,
.btnNew img,
.btnRemove img,
.btnSave img,
.btnPrint img,
.btnSearch img,
.btnExtFilter img,
.btnClose img,
.aBtnStorno img,
.aBtnNew img,
.aBtnRemove img,
.aBtnSave img,
.aBtnPrint img,
.btn img {
	vertical-align: top;
}



.btnNew,
.aBtnNew {
	background: var(--btnNewBg);
	color: var(--btnNewFg) !important;
	border-color: var(--btnNewBorder);
}

.btnPrint,
.aBtnPrint {
	background: var(--btnPrintBg);
	color: var(--btnPrintFg);
	border-color: var(--btnPrintBorder);
}

.btnSearch {
	background: var(--btnSearchBg);
	color: var(--btnSearchFg);
	border-color: var(--btnSearchBorder);
}

.btnExtFilter {
	background: var(--btnExtFilterBg);
	color: var(--btnExtFilterFg) !important;
	border-color: var(--btnExtFilterBorder);
}

.btnStorno,
.btnRemove,
.btnClose,
.aBtnStorno,
.aBtnRemove {
	background: var(--btnStornoBg);
	color: var(--btnStornoFg) !important;
	border-color: var(--btnStornoBorder);
}

.btnSave,
.aBtnSave {
	background: var(--btnSaveBg);
	color: var(--btnSaveFg) !important;
	border-color: var(--btnSaveBorder);
}

/* butony na A hrefu */
.aBtnStorno,
.aBtnNew,
.aBtnRemove,
.aBtnSave,
.aBtnPrint {
	display: inline-block;
	text-decoration: none;
}

input,
select,
textarea {
	background: var(--inputBg);
	color: var(--inputFg);
	border: 1px solid var(--inputBorder);
	margin-bottom: 5px;
	padding: 8px;
	font-size: 14px;
}

input:focus,
select:focus,
textarea:focus {
	border-color: var(--inputFocusBorder);
	outline: none;
}

.myBtns .btnSave {
	margin-left: 20px;
}


/*********************************************
 * sekce
 */
.sectionBox,
.systemMsg {
	position: relative;
	max-width: 800px;
	border: 1px solid var(--sectionBoxBorder);
	background: var(--sectionBoxBg);
	padding: 12px;
	border-radius: 6px;
	margin-top: 15px;
}

.systemMsg {
	margin-top: 0px;
	margin-bottom: 30px;
}

.systemMsgError {
	background: var(--systemMsgErrorBg);
	border-color: var(--systemMsgErrorBorder);
}

.systemMsgOk {
	background: var(--systemMsgOkBg);
	border-color: var(--systemMsgOkBorder);
}

.systemMsg p {
	margin: 2px 0px;
}

.sectionBoxTop {
	border-bottom: none;
	border-radius: 6px 6px 0px 0px;
}

.sectionBoxBottom {
	margin-top: 5px;
	border-top: none;
	border-radius: 0px 0px 6px 6px;
}

.sectionBox h3 {
	margin-top: 0;
}

.sectionBox .sectionEdit {
	position: absolute;
	top: 10px;
	right: 10px;
	opacity: 0.6;
	cursor: pointer;
	transition: opacity 0.2s ease;
}

.sectionBox .sectionEdit:hover {
	opacity: 1;
}

.sectionBox label {
	display: inline-block;
	text-align: right;
	margin-right: 10px;
	margin-bottom: 2px;
}

.sectionBox span {
	display: inline-block;
	margin-bottom: 2px;
}



.sectionBox .sectionTab  {
	width: auto;
	border-collapse: collapse;
	margin-bottom: 10px;
}

.sectionBox .sectionTab td:first-child {
	width: 120px;
	padding-right: 10px;
	text-align: right;
	vertical-align: top;
}

/* potvrzovaci a chybova hlaska */
.sectionBox .sectionConfirm,
.sectionBox .sectionConfirmRedirect,
.sectionBox .sectionError {
	display: none;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
}

.sectionBox .sectionError {
	color: var(--sectionErrorFg);
	text-shadow: var(--sectionErrorShadow);
	margin-bottom: 12px;
}
/* potvrzovaci a chybova hlaska - konec */

.sectionBox::after {
	content: '';
	display: block;
	clear: both;
}

/* konec sekcí */

.loginHint {
	color: var(--loginHintFg);
	font-style: italic;
	margin-top: 5px;
	font-size: 11px;
}

small.price {
	font-size: 75%;
	color: #aaa;
}

/** mobilni verze */

@media (max-width: 600px) {
	.sectionBox label {
		text-align: left;
	}
}


/*********************************************
 * patička
 */

footer {
	background: var(--footerBg);
	color: var(--footerFg);
	border-top-color: var(--footerBorderFg);
	padding: 40px 0px 20px 0px;
	overflow: hidden;
}

footer .container {
	max-width: 1200px;
	margin: auto;
}

footer a {
	color: var(--footerLinkFg);
	text-decoration: none;
}

footer a:hover {
	color: var(--footerLinkHoverFg);
	text-decoration: underline;
}

.footerCols {
	overflow: hidden;
}

.footerCol {
	float: left;
	width: 33.33%;
	box-sizing: border-box;
	padding: 0 20px;
}

footer input,
footer textarea {
	width: 100%;
	margin: 5px 0;
	padding: 8px;
	box-sizing: border-box;
}

.footerCol h4 {
	margin-bottom: 10px;
	border-bottom: 1px solid var(--footerH4BorderFg);
	padding-bottom: 5px;
}

footer textarea {
	height: 100px;
}

footer .contactFooter input:first-of-type {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

footer .contactFooter button {
	margin-top: 10px;
	padding: 10px 20px;
}

.contactFooterOk,
.contactFooterErr {
	display: none;
	margin: 10px 0 20px;
	padding: 10px;
	border-radius: 4px;
	border: 1px solid transparent;
	font-weight: bold;
}

.contactFooterErr {
	color: var(--contactFooterErrFg);
	background: var(--contactFooterErrBg);
	border-color: var(--contactFormErrBorderFg);
}

.contactFooterOk {
	color: var(--contactFooterOkFg);
	background: var(--contactFooterOkBg);
	border-color: var(--contactFormOkBorderFg);
}

.footerBottom {
	text-align: center;
	padding-top: 20px;
	font-size: 12px;
	color: var(--footerBottomFg);
}

@media(max-width: 600px) {
	.footerCol {
		width: 100%;
	}
}

.footerMeta {
	font-size: 11px;
	color: var(--footerMetaFg);
	text-align: center;
	margin-top: 20px;
	padding-top: 10px;
	font-style: italic;
}