/* This stylesheet is handwritten by Ragnar | ragnar@meego.ee */

html, body { margin: 0; padding: 0; height: 100%; background-color: #f2f2f2; color: #232122; }
a { color: #232122; }
	a:not(.btn):hover, a:not(.btn):focus { color: #b38867; text-decoration: none; }
input:disabled, textarea:disabled, input[readonly] { box-shadow: none; border: 1px solid #ccc; background-color: #f1f1f1 !important; color: #ccc; }
	input[readonly]:focus { box-shadow: none; }
input:disabled + label, input:disabled + label:before { color: #ccc !important; }

.show-pointer, .btn { cursor: pointer; }

.btn-primary { color: #fff; background-color: #b38867; border-color: #b38867; }
	.btn-primary:hover { background-color: #666 !important; border-color: #666; }
.btn-secondary { color: #fff; background-color: #ccc; border-color: #ccc; }
	.btn-secondary:hover { background-color: #666 !important; border-color: #666; }
.btn-default { color: #666; background-color: #fff !important; border-color: #666; }
	.btn-default:hover { color: #fff; background-color: #666 !important; border-color: #666; }
.btn-info { color: #195190; background-color: #fff !important; border-color: #195190; }
	.btn-info:hover { color: #fff; background-color: #195190 !important; border-color: #195190; }
.btn-success { color: #86ac41; background-color: #fff !important; border-color: #86ac41; }
	.btn-success:hover { color: #fff; background-color: #86ac41 !important; border-color: #86ac41; }
.btn-warning { color: #de7a22; background-color: #fff !important; border-color: #de7a22; }
	.btn-warning:hover { color: #fff; background-color: #de7a22 !important; border-color: #de7a22; }
.btn-danger { color: #ED5752; background-color: #fff !important; border-color: #ED5752; }
	.btn-danger:hover { color: #fff; background-color: #ED5752 !important; border-color: #ED5752; }
	
.btn-success:not(:hover).disabled, .btn-warning:not(:hover).disabled, .btn-danger:not(:hover).disabled, .btn-info:not(:hover).disabled,
	.btn-success:not(:hover):disabled, .btn-warning:not(:hover):disabled, .btn-danger:not(:hover):disabled, .btn-info:not(:hover):disabled { border-color: #ccc; color: inherit; }

.bg-primary { background-color: #b38867 !important; }
.bg-secondary { background-color: #ebe5d9 !important; }
.bg-info { background-color: #def3fd !important; }
.bg-success { background-color: #d7e7a9 !important; }
.bg-warning { background-color: #fbe89d !important; }
.bg-danger { background-color: #ffc7c7 !important; }

.border-primary { border-color: #b38867 !important; }
.border-secondary { border-color: #ccc !important; }
.border-info { border-color: #195190 !important; }
.border-success { border-color: #86ac41 !important; }
.border-warning { border-color: #de7a22 !important; }
.border-danger { border-color: #ED5752 !important; }

.text-primary { color: #b38867 !important; }
	a.text-primary:hover, a.text-primary:focus { background-color: #b38867; color: #fff !important; border-radius: 0.2rem; }
a.text-secondary { color: #ccc !important; }
	a.text-secondary:hover, a.text-secondary:focus { background-color: #ccc; color: #fff !important; border-radius: 0.2rem; }
a.text-info { color: #195190 !important; }
	a.text-info:hover, a.text-info:focus { background-color: #195190; color: #fff !important; border-radius: 0.2rem; }
a.text-success { color: #86ac41 !important; }
	a.text-success:hover, a.text-success:focus { background-color: #86ac41; color: #fff !important; border-radius: 0.2rem; }
a.text-warning { color: #de7a22 !important; }
	a.text-warning:hover, a.text-warning:focus { background-color: #de7a22; color: #fff !important; border-radius: 0.2rem; }
a.text-danger { color: #ED5752 !important; }
	a.text-danger:hover, a.text-danger:focus { background-color: #ED5752; color: #fff !important; border-radius: 0.2rem; }

.col-form-label { font-weight: bold; }
.form-check { position: relative; }
	.form-check input { position: absolute; top: 50%; left: 0; transform: translate(0, -50%); display: none; margin: 0; }
	.form-check label { position: relative; display: block; margin-left: 20px; padding: 3px 0; cursor: pointer; }
		.form-check label:before { position: absolute; top: calc(50% - 2px); left: -20px; transform: translate(0, -50%); display: inline-block; content: "\f0c8"; font-family: "Font Awesome 5 Free"; font-size: 18px; font-weight: 400; color: #666; }
			.form-check .btn-success:hover input + label:before, .form-check .btn-warning:hover input + label:before, .form-check .btn-danger:hover input + label:before, .form-check .btn-info:hover input + label:before { color: #fff; }
				.form-check input:checked + label:before { content: "\f14a"; color: #232122; }
				.form-check .btn-info:hover input:checked + label:before { content: "\f14a"; color: #232122; }
.radio { position: relative; }
	.radio input { position: absolute; top: 50%; left: 0; transform: translate(0, -50%); display: none; margin: 0; }
	.radio label { position: relative; display: inline-block; margin-left: 20px; padding: 3px 5px; cursor: pointer; }
		.radio label:before { position: absolute; top: calc(50% - 2px); left: -20px; transform: translate(0, -50%); display: inline-block; content: "\f111"; font-family: "Font Awesome 5 Free"; font-size: 18px; font-weight: 400; color: #666; }
			.radio .btn-success:hover input + label:before, .radio .btn-warning:hover input + label:before, .radio .btn-danger:hover input + label:before, .radio .btn-info:hover input + label:before { color: #fff; }
				.radio input:checked + label:before { content: "\f058"; color: #232122; }
				.radio .btn-info:hover input:checked + label:before { content: "\f058"; color: #fff; }
.has-error .help-block, .has-error .control-label, .has-error .radio, .has-error .form-check, .has-error .radio-inline, .has-error .checkbox-inline,
	.has-error.radio label, .has-error.form-check label, .has-error.radio-inline label, .has-error.checkbox-inline label, .has-error .form-check label:before, .has-error.radio label:before { color: #a94442; }
	.has-error .form-control { border-color: #a94442; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
		.has-error .form-control:focus { border-color: #843534; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; }

.card { border-color: #b3b3b3; }
	.card .card-header { background-color: #ebe5d9; /*background-color: #ccd3d9;*/ border-bottom: 0; font-weight: bold; }
		.card .card-header.slidebody { position: relative; cursor: pointer; }
			.card .card-header.slidebody:before { position: absolute; left: 3px; content: "\f078"; font-family: "Font Awesome 5 Free"; }
				.card .card-header.slidebody.active:before { content: "\f077"; }
.card .row:not(.form-group):hover, .table-hover tbody tr:hover { background-color: #ebe5d9; }
.constrained-area { max-height: 200px; overflow: hidden; overflow-y: auto; }

/* TOP navigation */
.navbar { background-color: #fff !important; }
	.navbar .navbar-brand, .navbar .dropdown .dropdown-toggle { color: #232122; }
		.navbar .navbar-brand:hover, .navbar .dropdown .dropdown-toggle:hover { color: #ccc; }

/* Pagination */
.def-pagi > nav { display: inline-block; }
.def-pagi ul.pagination li { display: inline-block; margin-left: 5px; }
	.def-pagi ul.pagination li a, .def-pagi ul.pagination li span { float: none; border-color: #ccc; color: initial; }
	.def-pagi ul.pagination li.active span, .def-pagi ul.pagination li:hover span { background-color: #b38867; border-color: #ccc; color: #fff; }

/* Calendar view */
#clients li:hover { background-color: #ebe5d9; }
#CalEvents ul li label { position: relative; margin-left: 24px; }
	#CalEvents ul li input { display: none; }
		#CalEvents ul li input:checked + label:before { position: absolute; top: 3px; left: -21px; content: "\f00c"; font-family: "Font Awesome 5 Free"; font-size: 14px; font-weight: 600; color: #b38867; }
	#CalEvents ul li label:after { position: absolute; top: -5px; left: -24px; content: "\f0c8"; font-family: "Font Awesome 5 Free"; font-size: 24px; font-weight: 400; color: #ccc; }
#CalFilters span { position: relative; margin-left: 24px; }
	#CalFilters span.activ { background-color: #b38867; }
	#CalFilters span.activ:before { position: absolute; top: 3px; left: -21px; content: "\f00c"; font-family: "Font Awesome 5 Free"; font-size: 14px; font-weight: 600; color: #b38867; }
	#CalFilters span:after { position: absolute; top: -5px; left: -24px; content: "\f0c8"; font-family: "Font Awesome 5 Free"; font-size: 24px; font-weight: 400; color: #ccc; }
		#CalFilters span.activ:after { color: #b38867; }
.ws-calendar .caltable { padding: 0; }
	.ws-calendar .caltable table { width: 100%; }
		.ws-calendar .caltable thead { border-bottom: 1px solid #ccc; }
			.ws-calendar .caltable thead tr:nth-of-type(2) { }
				.ws-calendar .caltable thead th { padding: 3px 5px; text-align: center; }
					.ws-calendar .caltable thead th a { display: block; line-height: 30px; }
					.ws-calendar .caltable thead th.small { line-height: 20px; }
		.ws-calendar .caltable tbody tr { border-bottom: 1px solid #ccc; }
			.ws-calendar .caltable tbody td { position: relative; padding: 5px; width: calc(100% / 7); height: 10vh; vertical-align: top; border-right: 1px solid #ccc; font-size: 12px; }
				.ws-calendar .caltable tbody tr:not(.dayinfos) td:first-of-type { width: 30px; vertical-align: middle; background-color: #f9f9f9; }
				.ws-calendar .caltable tbody tr td:last-of-type { border-right: 0; }
					.ws-calendar .caltable tbody tr td > span, .ws-calendar .caltable tbody tr td > span > label { cursor: pointer; }
					.ws-calendar .caltable tbody tr td > div:hover { background-color: #ebe5d9; }
					.ws-calendar .caltable tbody tr td > div > strong { width: 25%; }
				.ws-calendar .caltable .today { background-color: #eaf2f4; }
				.ws-calendar .caltable .weekend { background-color: #f9f9f9; }
				.ws-calendar .caltable .workday { }
				.ws-calendar .caltable .elseday { color: #ccc; }
				.ws-calendar .caltable tbody tr td:not(:first-of-type):hover {
					position: relative; z-index: 1; cursor: pointer;
					-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
				}
				.ws-calendar .caltable tbody tr.dayinfos > td { padding: 0; width: auto; height: auto; border: 0; }
					.ws-calendar .caltable tbody tr.dayinfos > td > ul { position: absolute; width: 100%; z-index: 9; }
						.ws-calendar .caltable tbody tr.dayinfos > td > ul li { font-size: 0.9rem; }
						.ws-calendar .caltable tbody tr.dayinfos > td > ul li.mobevent { cursor: pointer; }

.dropzone { min-height: 20px; padding: 0; border: 1px solid #ccc; background-color: #eee; border-radius: 4px; }
	.dropzone:hover, .dropzone.disabled { background-color: #ebe5d9; }
	.dropzone .dz-message { margin: 10px 0; }

/* jquery-ui-timepicker-addon
----------------------------------*/

.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 40%; }
.ui-timepicker-div td { font-size: 100%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }
.ui-timepicker-div .ui_tpicker_unit_hide{ display: none; }

.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input { background: none; color: inherit; border: none; outline: none; border-bottom: solid 1px #555; width: 95%; }
.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input:focus { border-bottom-color: #aaa; }

.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
.ui-timepicker-rtl dl dt{ float: right; clear: right; }
.ui-timepicker-rtl dl dd { margin: 0 40% 10px 10px; }

/* Shortened version style */
.ui-timepicker-div.ui-timepicker-oneLine { padding-right: 2px; }
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time, 
.ui-timepicker-div.ui-timepicker-oneLine dt { display: none; }
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time_label { display: block; padding-top: 2px; }
.ui-timepicker-div.ui-timepicker-oneLine dl { text-align: right; }
.ui-timepicker-div.ui-timepicker-oneLine dl dd, 
.ui-timepicker-div.ui-timepicker-oneLine dl dd > div { display:inline-block; margin:0; }
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_minute:before,
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_second:before { content:':'; display:inline-block; }
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_millisec:before,
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_microsec:before { content:'.'; display:inline-block; }
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide,
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide:before{ display: none; }

/* Date-time-picker design */
#ui-datepicker-div { padding: 5px; border: 1px solid #ccc; border-radius: 0; }
	.ui-datepicker { width: auto; }
	.ui-datepicker .ui-widget-header.ui-corner-all { background-color: #ccc; border: 0; border-radius: 0; }
	.ui-datepicker .ui-widget-header.ui-corner-all .ui-datepicker-title select { padding: 10px 5px; }
	.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-prev-hover { top: 12px; left: 7px; }
	.ui-datepicker .ui-datepicker-next, .ui-datepicker .ui-datepicker-next-hover { top: 12px; right: 7px; }
	.ui-datepicker .ui-widget-header.ui-corner-all .ui-icon { background-image: url("../js/images/ui-icons_ffffff_256x240.png"); color: #ccc; }
		.ui-datepicker .ui-widget-header.ui-corner-all .ui-state-hover { border: 0; background-color: transparent; cursor: pointer; }
		.ui-datepicker .ui-widget-header.ui-corner-all .ui-state-hover .ui-icon { background-image: url("../js/images/ui-icons_555555_256x240.png"); }
	.ui-datepicker .ui-datepicker-calendar .ui-state-default { padding: 9px 12px; background-color: #ccc; color: #232122; border: 0; text-align: center; }
		.ui-datepicker .ui-datepicker-calendar .ui-priority-secondary { background-color: #ebe5d9; }
		.ui-datepicker .ui-datepicker-calendar .ui-state-highlight { background-color: #ccd3d9; }
		.ui-datepicker .ui-datepicker-calendar .ui-state-active { background-color: #ebe5d9; }
		.ui-datepicker .ui-datepicker-calendar .ui-state-hover { background-color: #ebe5d9; }
	.ui-datepicker .ui-timepicker-div dl { margin: 0; }
	.ui-datepicker .ui-timepicker-div dt, .ui-datepicker .ui-timepicker-div .ui_tpicker_time_label { padding: 10px 10px 10px 5px; }
	.ui-datepicker .ui-timepicker-div select { padding: 10px; }
	.ui-datepicker .ui-datepicker-buttonpane button { margin: 5px; padding: 10px; }

/* Manage users */
.rolelist { display: -webkit-flex; -webkit-flex-wrap: wrap; display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
	.rolelist li { margin: 0 5px 2px; padding: 5px; min-width: 50px; text-align: center; }
		.rolelist li:hover { background-color: #ebe5d9; }
		.rolelist li:not(:first-child) { border: 1px solid #ccc; cursor: pointer; }
		.rolelist li a { display: inline-block; margin: -5px 0; padding: 5px 10px; font-weight: normal; }
			.rolelist li a:last-of-type { margin-right: -5px; }
			.rolelist li a:hover { background-color: #232122; color: #fff; }
.userlist { display: -webkit-flex; -webkit-flex-direction: column; display: flex; flex-direction: column; list-style: none; margin: 0; padding: 0; }
	.userlist > li { border-bottom: 1px solid #ccc; }
		.userlist > li > label { display: block; margin: 0; padding: 5px; cursor: pointer; }
		.userlist > li > label:hover { background-color: #ebe5d9; }
		.userlist > li > label > ul { list-style: none; display: inline-block; float: right; margin: -5px -5px -5px 0; padding: 0; }
			.userlist > li > label > ul > li { display: inline-block; margin: 0; border: 0; background-color: #232122; }
				.userlist > li > label > ul > li span { display: inline-block; padding: 5px; color: #fff; }
				.userlist > li > label > ul > li a { display: inline-block; padding: 5px; color: #fff; }
				.userlist > li > label > ul > li:hover { background-color: #666; }
#listusers .col-lg-6.col-md-12 input[type="text"], #listusers .col-lg-6.col-md-12 select { display: inline-block; float: left; margin-right: 5px; width: 60%; }

@media (min-width: 1200px){
	.container { max-width: 1360px; }
}

@media only screen and (min-width: 768px) and (max-width: 1199px){
	.container { max-width: none; }
}
@media only screen and (max-width: 1199px){
	.ws-calendar .caltable tbody tr td > div > strong { width: 100%; }
}

@media only screen and (max-width: 991px){

}

@media only screen and (max-width: 767px){
	.ws-calendar .caltable tbody td { padding: 2px; }
}

@media only screen and (max-width: 576px){
		#listusers .col-lg-6.col-md-12 button#delaction { margin-top: 10px; }
	.userlist > li > label > ul { display: block; margin: 10px -5px 0 0; width: 100%; }
}

@media only screen and (max-width: 480px){
	.btn { white-space: normal; }
}