/**** THIS FILE BELONGS TO FORESEEN INSTANCE uniformdev.lukashozak.cz, LAST REFRESHED ON 2025-11-03 20:57:39 ****/
:root {
	--tablet-width : 800px;
}

html { /*scroll-behavior : smooth;*/ } /* put this to scroll container using system-scroll-smooth later - now HTML is the container */
body {
	margin : 0; 
	font-family : Helvetica, Arial, sans-serif;
	/*background-color: #CFEAF0; */
} /* near to powderblue but ligher, better legibility */
fieldset { border: 1PX solid black; }
figure { border: 1px solid teal; }
a { color : #25c; }



.system-table-row-label td:first-child {
	text-align : left;
}
th { padding : 0 10px; }
td {
	text-align:center;
	padding : 0 5px;
}

.tab {
	display : inline-block;
	width : 20px;
}

#system-header {
	position : relative;
	width : 100%;
	height : 40px;
	background : #14385c;
	color : white;
}

#system-header-logo {
	height : 22px;
	float : left;
	margin : 9px 10px;
}

#system-header-menu{
	position : relative;
	float:left;
	height : 22px;
	margin : 10px 7px 0 0;
}

.system-header-menu-float{
	position:absolute;
	top : 25px;
	left : 16px;
	background : var(--system-primary);
	padding : 10px;
	min-width : 180px;
	z-index : 100;
	display : none;
	overflow-y: scroll;
    max-height: calc(100vh - 70px);
}

.system-header-menu-item {
	margin-top : 10px;
	text-decoration :none;
	color : var(--surface);
}

.system-header-menu-item:hover {
	background : var(--system-primary-light);
}

#system-header-title {
	float : left;
	margin : 10px 7px;
	height : 19px;
	max-width: 445px;
	white-space : nowrap;
	overflow : hidden;
	
}

#system-header-quote {
	display : none;
	float: left;
    max-width: 600px;
    max-height: 34px;
    margin: 2px 47px;
    
    color: lightgray;
}

@media (min-width: 1400px) {
	#system-header-quote {
		display:block;
	}
}

#system-header-icons {
	float : right;
	margin : 9px 5px;
}

#system-task-list, #system-current-task {
	margin : 0 7px;
}

.system-header-log-icon:after {
	content:attr(value);
	font-size : 10px;
	color : white;
	background: gray;
	border-radius:50%;
	padding:3px;
	position:relative;
	left:-8px;
	top:-10px;
	opacity:0.9;
}

#system-header-user {
	float : right;
	margin : 10px 10px;
	/*text-decoration : underline;*/
}

.system-logout-button {
	color : white;
	text-decoration : none;
}

.system-logout-button:hover {
	color : orange;
}


#system-main-menu {
	float : left;
	width : 250px;
	height : calc(100vh - 40px);
	overflow-y : hidden;
	overflow-x : hidden;
	background : #205080;;
}

#system-main-menu-filter {
	width : 100%;
	height : 45px;
	background : #205080;;
	border-bottom : 3px solid #1b4570;
}

#system-main-menu-filter-input {
	width: 210px; /* includes padding, margin, border below */
	margin: 10px 10px;
	padding : 3px 8px;
	border: 2px solid #8c97ac;
	background : #205080;
	color: white;
	border-radius : 10px;
}

#system-main-menu-filter-input::placeholder {
  color: #8c97ac;
}

#system-main-menu-filter-input::-webkit-input-placeholder {
  color: #8c97ac;
}

#system-main-menu-items{
	overflow-x : hidden;
	overflow-y : scroll;
	height : calc(100% - 48px); /* filter incl. border */
	background : #14385c;
}

.system-main-menu-children{
	display : none;
}

.system-main-menu-item {
	padding : 10px 10px;
	border-top: 1px solid #14385c;
	text-decoration : none;
	color: white;
}

#system-main-menu-items a:first-child .system-main-menu-item {
	border-top : none;
}

.system-main-menu-item-selected {
	background : #eee;
	color : black;
	border-left : 5px solid black;
}

.system-menu-level-0 {
	background : #205080;
}

.system-menu-level-0:hover {
	border-left : 5px solid #14385c;
}

.system-menu-level-1 {
	padding : 10px 15px;
	background : #14385c;
	border-top : 1px solid #205080;
}

.system-menu-level-1:hover {
	border-left : 5px solid #205080;
}

.system-menu-level-2 {
	padding : 10px 20px;
	background : #bdc2cd;
}

/* MESSAGES FOR USERS */

#system-messages {
	position : absolute;

	top : 75px;
	left: 50%;
	z-index : 1000;
}

.system-message {
	position : relative;
	width : calc(100% - 70px);
	margin : 10px 20px;
	padding : 15px;
	
	background : blue;
	color : white;
	border-radius:15px;
	margin-bottom : 10px;
	text-align : center;
}

.system-message-error {
	background : firebrick;
}

.system-message-fadein {
	animation : message-fadein 1s;
}

.system-message-fadeout {
	animation : message-fadeout 1.5s;
}

@keyframes message-fadein {
	0% { top : -50px; opacity : 0%; }
	100% { top:  0px; opacity : 100%; }
}

@keyframes message-fadeout {
	0% { top: 0px; opacity : 100% }
	100% { top: 50px; opacity: 0% }
}

.system-public-announcements {
	position:absolute;
	top : 37px;
	width : 550px;
	padding: 5px;
	z-index : 10000;
}

.system-public-announcements .error, .system-public-announcements .warning, .system-public-announcements .info {
	width: 99%;
	margin: 5px auto;
	padding: 10px 40px;
	background: #c25;
	border-radius: 20px;
}

.system-top-button {
	margin : 10px 10px 10px 0;
	padding: 2px 6px 1px 6px;
}

.system-top-button-container {
	float: right;
}


/* no, use the generic error,warning, info colors! */
/*.system-public-announcements .error{ 	color: white; background: #c25; }
.system-public-announcements .warning { color: white; background: #c95;}
.system-public-announcements .info { 	color: white; background: #25c; }*/

/* GLASS */

#system-glass {
	position : fixed;
	left : 0;
	top : 0;
	background : rgb(200, 200, 255);
	z-index : 100000;
	height : 100%;
	width : 100%;
	overflow : hidden;
	display: none;
}

@supports (-webkit-backdrop-filter : none) or (backdrop-filter : none){
	#system-glass {
		-webkit-backdrop-filter : blur(4px);
		backdrop-filter : blur(4px);
		background : rgba(153, 153, 200, 0.5);
	}
}

#system-glass-content-holder {
	width : 55%;
	margin : 20px auto;
	padding : 15px;
	border-radius : 15px;
	text-align : center;
	background : #fafafa;
}

#system-exceptions, #system-errors, #system-warnings, #system-infos, #system-debugs {
	overflow-wrap : anywhere;
}

.system-debug-message { padding: 7px; }
.system-debug-message:empty { padding : 0; }
.system-debug-message p { margin: 5px 0; }

#system-exceptions { border: 3px solid darkred; background: darkred; color: white; }
#system-errors { border: 3px solid red; background: red; color: white; }
#system-warnings { border: 3px solid orange; }
#system-infos { border: 3px solid blue; }
#system-debugs{ border: 1px solid limegreen; }

@media (max-width: 600px) {
	#system-glass-content-holder {
		width : 90%;
	}
}

.system-glass-content {
	
}

.system-glass-message {
	
}

.system-glass-buttons {
	
}

.system-glass-button {
	min-height : 30px;
	min-width : 80px;
	border-radius : 5px;
	margin : 10px 30px;
}

.system-glass-button-yes {
	background : blue;
	color : white;
}

.system-glass-button-no {
	background : red;
	color : white;
}

.cleaner, .clearer, .clear-both, .system-clear-both { clear : both; }


/* Content */
#system-content {
	float:left;
	width : calc(100% - 250px);
	height : calc(100vh - 40px);
	/*padding: 10px;*/
}

#system-content-wide {
	float:left;
	width : calc(100%);
	height : calc(100vh - 40px);
}

#system-content-container {
	width : 100%;
	height : 100%;
	
	overflow : auto;
}

/*.stripe1 { margin: 10px 0px 0px 0px; height: 100px; width: 100%; background: rgb(150, 255, 255); }*/
/*.stripe2 { margin: 10px 0px 0px 0px; height: 100px; width: 100%; background: rgb(195, 255, 255); }*/

/* DELETE SOMETHING */
.system-table-delete {
	background : #f78;
	color: white;
}

/* TOOLTIP */

.system-tooltip {
	position: relative;
	border-bottom: 1px dotted black;
}

.system-tooltip .system-tooltip-text {
	visibility : hidden;
	width: 120px;
	background-color: black;
	color: #fff;
	text-align: center;
	padding: 5px 0px;
	border-radius: 6px;
	position: absolute;
	z-index: 1;
	top: 100%;
	left: 0%;
	width: 200%;
	transform: translate(10px, 10px);
	padding : 5px 10px;
}

.system-tooltip:hover .system-tooltip-text {
	visibility: visible;
}

/* buttons */
.system-button { user-select : none; }
.system-submit, .system-cancel { border-radius : 10px; color: white; padding: 5px 10px; margin: 0px 10px; }
.system-top-button-container > .system-submit { margin : 7px 10px; }
.system-submit { background : #093; }
.system-cancel { background : #930; }

/* Table */
.system-table { }
.system-table-delete { font-size:17px; vertical-align: middle; }
.system-table-header > th { text-align : center; }
.system-table-record-link { }
.system-table > tbody> tr > th, .system-table > tbody > tr > td {
	vertical-align : middle;
}

/* Columns */
.system-columns {
	position : relative;
	margin : 15px 0;
}

.system-one-column { 
	width : 100%;
}

.system-two-columns {
	float : left;
	width : 50%;
}

@media (max-width: 600px) {
	.system-two-columns {
		float : none;
		width: 100%;
	}
}

.system-two-columns-left {
	
}

.system-two-columns-right {
	
}

.system-three-columns {
	float : left;
	width : 33.3%;
}

.system-three-columns-left {
	
}

.system-three-columns-middle {
	
}

.system-three-columns-right {
	
}

.system-center { margin-left : auto; margin-right: auto; }

@media (max-width: 600px) {
	.system-column-one {
		width : 65%;
	}
}

.system-progress-bar {
	width : calc(100% - 30px);
	height: 35px;
	margin : 0 15px;
	border-radius: 5px;
	background-size: 35px 35px;
	background-image : repeating-linear-gradient(
		45deg,
		gray, gray 25%,
		lightgray 25%, lightgray 50%,
		gray 50%, gray 75%,
		lightgray 75%, lightgray 100%
	);
}
.system-progress-bar-indicator {
	width : 0;
	height : 100%;
	background : limegreen;
	border-radius: 5px;
}
.system-progress-bar-value {
	position: relative;
	width: fit-content;
	height : 50%;
	left : 50%;
	top : -75%;	
	background : white;
	box-shadow : 0 0 5px 5px white;
}

.system-progress-bar.animated {
	animation: system-progress-bar-animated 2s linear infinite;
}

@keyframes system-progress-bar-animated {
	0% { background-position: 0 0; }
	100% { background-position: 70px 0; }
}

.system-column-one .system-form-label {
	width : 150px;
}

.system-column-one .system-form-input {
	width : 150px;
}

/* Inline editor */
.system-inline-editor { background: #999; border-radius: 15px; border: 2px solid #ccc; padding : 10px; position: absolute; left : 50px; }

/* Galleries */
.system-gallery { width: 75%; margin: 0 auto; }

/* Images */

/* Tabs */
.system-tabs-header {
	margin-top : 15px;
}
.system-tabs-header .active {
	background: lightgray;
	border-bottom : 1px solid lightgray;
}

.system-tabs-tab-label {
	display : inline-block;
	padding : 10px;
	background : #eee;
	border-right : 1px solid white;
	border-top-left-radius : 10px;
	border-top-right-radius : 10px;
	font-weight : 600;
}
.system-tabs-tab-label:last-child {
	border-right : 1px solid #eee;
}

/* Page Widgets */
.system-widget {
	position: relative;
}
/*.system-jumbotron { width:90%; margin: 20px auto; padding: 50px 0; font-size: 50px; font-weight: 900; background-color: limegreen; text-align: center; border-radius: 20px; }
.system-widget-video, .system-video { width : 80%; margin: 20px auto; }
.system-widget-audio { width : 60%; margin: 20px auto; }*/

/* Menu */
.system-menu-group { }
.system-menu-item { color: black; text-decoration: none; }
.system-menu-item.system-important { color : darkviolet; }
.system-menu-icon { margin-right: 3px; }
.system-menu-settings { color: blue; }
.system-menu-pages { color: green; }
.system-menu-active-page { font-size : 17px; color : blue; font-weight: bold; }
.system-menu-active-page.system-important { color : blue; }
#system-menu-filter { margin-left : 5px; }
#system-menu-filter > label { width : initial; }
#system-menu-filter > input { max-width : 230px; }

.system-dropdown-menu {
	position : absolute;
	padding : 5px 0;
	
	/*left : 25px;
	top : 35px;*/
	
	background : white;
	box-shadow : 4px 4px 4px 4px rgba(0, 0, 0, 0.29);
	border-radius : 4px;
	border : 1px solid lightgray;
	z-index : 1000;
}

.system-dropdown-menu-item, .system-dropdown-menu-label {
	display: block;
	padding : 5px 10px;
}
.system-dropdown-menu-item:hover {
	background : lightgray;
}

/* Transitions */
.system-transition-opacity-fadein {
    opacity: 1.0;
	animation-name: system-transition-opacity-fadein;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: 2s;
}

@keyframes system-transition-opacity-fadein {
    0% {
        opacity: 0.0;
    }
    100% {
        opacity: 1.0;
    }
}

/* Rainbow */
.pn-single-post-wrapper__content-main p:nth-child(6n+1)::-moz-selection{background:rgba(255,150,155,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+1)::selection{background:rgba(255,150,155,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+2)::-moz-selection{background:rgba(255,190,129,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+2)::selection{background:rgba(255,190,129,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+3)::-moz-selection{background:hsla(57,93%,73%,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+3)::selection{background:hsla(57,93%,73%,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+4)::-moz-selection{background:hsla(90,90%,80%,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+4)::selection{background:hsla(90,90%,80%,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+5)::-moz-selection{background:rgba(157,236,255,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+5)::selection{background:rgba(157,236,255,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+6)::-moz-selection{background:rgba(212,169,255,.25)}
.pn-single-post-wrapper__content-main p:nth-child(6n+6)::selection{background:rgba(212,169,255,.25)}

/* Thin scrollbars - Mozilla */
.system-thin-scrollbar { 
	scrollbar-width: thin;
	/*scrollbar-color: blue orange;*/
}

/* Thin scrollbars - Other */
.system-thin-scrollbar::-webkit-scrollbar {
	width: 12px;
}

.system-thin-scrollbar::-webkit-scrollbar-track {
  background: #14385c;
}

.system-thin-scrollbar::-webkit-scrollbar-thumb {
  background-color: white;
  border-radius: 10px;
  border: 3px solid #14385c;
}

.system-important { font-weight : 600; }
.system-exception { color : black; }
.system-error { color : red; }
.system-warning { color : orange; }
.system-info { color : lightblue; }
.system-smooth-scroll { scroll-behavior: smooth; }
.system-read-only input, .system-read-only textarea, div.system-read-only { background : #ededed; }