/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
:root {
	--text-color: rgba(0,0,0,0.7);
	--text-muted: rgba(0,0,0,0.4);
	--text-highlighted: rgba(53, 134, 255, 0.7);
	--text-loading: rgba(53, 134, 255, 0.5);
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* Generic */
/* -------------------------------------------------- */

* {
	box-sizing: border-box;
}

body {
	font-size: 12px;
	font-family: sans-serif;
	letter-spacing: 0.5px;
}

a {
	color: #00bcd4;
}

input:disabled,
button:disabled {
	opacity: 0.5;
	pointer-events: none;
}


/* Form elements */
/* -------------------------------------------------- */

input[type='text'],
input[type='password'],
input[type='number'] {
	display: block;
	width: 100%;
	padding: 2px 4px;
	font-size: 12px;
	color: rgba(0,0,0,0.8);
	border: 1px solid rgba(0,0,0,0.25);
	border-radius: 2px;
}

input[type='text']:focus,
input[type='password']:focus,
input[type='number']:focus {
	color: rgba(0,0,0,1);
	background-color: rgba(0,188,212,0.1);
	border: 1px solid rgba(0,0,0,0.4);
	outline: none;
}

input[type='number']::-webkit-inner-spin-button {
	-webkit-appearance: none;
}


input[type='text']::placeholder,
input[type='password']::placeholder {
	color: rgba(0,0,0,0.4);
}

input[type='date'] {
	padding: 2px 6px 0px 6px;
	line-height: 21px;
	font-size: 13px;
	font-family: sans-serif;
	color: rgba(0,0,0,0.8);
	border: 1px solid rgba(0,0,0,0.25);
	border-radius: 2px;
}

input[type='date']:focus {
	color: rgba(0,0,0,1);
	background-color: rgba(0,188,212,0.1);
	border: 1px solid rgba(0,0,0,0.4);
	outline: none;
}


.file-uploader > input[type='file'] {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	opacity: 0;
	z-index: -1;
	pointer-events: none;
}
.file-uploader > label {
	display: inline-block;
	width: 100%;
	height: 100%;
	font-size: 0;
	color: white;
	text-align: center;
	border: 1px solid rgba(0,0,0,0.2);
	background-color: #00bcd4;
	background-image: url('img/ic_add_a_photo_white_48.png');
	background-repeat: no-repeat;
	background-position: 45% 45%;
	background-size: 60%; 
	cursor: pointer;
}
.file-uploader > label:hover {
	background-color: #00cfeb;
}

.select-wrapper {
	position: relative;
}
.select-wrapper:before {
	content: '';
	position: absolute;
	pointer-events: none;
	top: 2px;
	right: 2px;
	bottom: 2px;
	width: 17px;
	background-color: rgba(0,0,0,0.05);
	background-image: url(img/ic_arrow_drop_down_black_48.png);
	background-repeat: no-repeat;
	background-size: 120%;
    background-position: 50%;
    opacity: 0.8;
}
.select-wrapper:hover:before {
	opacity: 1;
}
.select-wrapper > select {
	display: block;
	width: 100%;
	padding: 2px 20px 2px 4px;
	font-size: 12px;
	color: rgba(0,0,0,0.8);
	border: 1px solid rgba(0,0,0,0.25);
	border-radius: 2px;
	background-color: white;
	-webkit-appearance: none;
}
.select-wrapper > select:focus {
	color: rgba(0,0,0,1);
	background-color: rgba(0,188,212,0.1);
	border: 1px solid rgba(0,0,0,0.4);
	outline: none;
}

.cb-wrapper {
	position: relative;
	width: 21px;
	height: 21px;
}
.cb-wrapper > input {
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
}
.cb-wrapper > label {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-size: 0;
	border-radius: 2px;
	border: 1px solid rgba(0,0,0,0.25);
	background-color: white;
}
.cb-wrapper > input:focus + label {
	background-color: rgba(0,188,212,0.1);
	border: 1px solid rgba(0,0,0,0.4);	
}
.cb-wrapper > input:checked + label {
	background-image: url('img/ic_check_black_48.png');
	background-size: contain;
}

/* Buttons */
/* -------------------------------------------------- */

button {
	user-select: none;
	display: inline-block;
	cursor: pointer;
}
button:focus {
	outline: none;
}
button.disabled {
	opacity: 0.5;
}
button.edit,
button.blue,
button.green,
button.orange {
	padding: 8px 16px;
	font-size: 12px;
	color: white;
	text-align: center;
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 2px;
	box-shadow: 0 2px 4px rgba(0,0,0,0.25);
}
button.edit {
	background-color: #607d8b;
}
button.edit:hover {
	background-color: #7194a5;
}
button.blue {
	background-color: #00bcd4;
}
button.blue:hover {
	background-color: #00cfeb;
}
button.green {
	background-color: #00d446;
}
button.green:hover {
	background-color: #00eb85;
}
button.orange {
	background-color: #fc8507;
}
button.orange:hover {
	background-color: #ff9b32;
}
button.icon {
	padding: 0;
	font-size: 0;
	border: none;
	background-color: transparent;
	opacity: 0.6;
}
button.icon:hover {
	opacity: 1;
}
#start-visit,
#add-store,
#edit-store,
#add-order,
#add-product,
#edit-product,
#return-order {
	background-repeat: no-repeat;
	background-size: auto 70%;
	background-position: 6px 50%;
	padding: 8px 12px 8px 32px;	
}
#start-visit {
	background-image: url('img/ic_timer_white_48.png');
}
#add-store {
	background-image: url(img/ic_add_white_48.png);
}
#edit-store {
	background-image: url(img/ic_store_white_48.png);
}
#return-order {
    background-image: url(img/ic_return_white_48.png);
}
#add-order {
	background-image: url('img/ic_add_shopping_cart_white_48.png');
}
#add-order.added {
	pointer-events: none;
	background-color: #00c77e;
	background-image: url('img/ic_check_white_48.png');
	border: 1px solid rgba(0,0,0,0.05);
	box-shadow: none;
}

#add-product {
	background-image: url(img/ic_add_white_48.png);
}
#edit-product {
	background-image: url(img/ic_edit_white_48.png);
}


/* Loading */
/* -------------------------------------------------- */

#loading {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.75);
	z-index: 100;
}
#loading.visible {
	display: block;
}

#loading > .spinner {
	position: absolute;
	top: 50%;
	left: 50%;
    width: 60px;
    height: 60px;
	margin-top: -30px;
	margin-left: -30px;
    border: 8px solid rgba(255,255,255,0.1);
    border-top: 8px solid rgba(255,255,255,1);
    border-radius: 50%;
    animation: spin 1.5s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/* Warning */
/* -------------------------------------------------- */

#warning {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(200,20,20,0.9);
	z-index: 100;
}
#warning.visible {
	display: block;
}

#warning > .title {
	display: block;
	margin-top: 80px;
	color: #FFFFFF;
	font-size: 20px;
	text-align: center;
}
#warning > .reason {
	display: block;
	width: 80%;
	max-width: 600px;
	margin: auto;
	margin-top: 20px;
	line-height: 20px;
	color: #FFFFFF;
	font-size: 14px;
	text-align: center;
}

#warning > .accept {
	width: 120px;
	padding: 10px;
	margin: auto;
	margin-top: 40px;
	color: white;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	border: 2px solid white;
	border-radius: 4px;
	background-color: rgba(255,255,255,0.2);
	cursor: pointer;
}

#warning > .accept:hover {
	background-color: rgba(255,255,255,0.3);
}


/* Login */
/* -------------------------------------------------- */

#login-box {
	width: 300px;
	padding: 30px 40px;
	margin: 60px auto;
	text-align: center;
}
#login-box.fail {
	border: 1px solid rgba(255,0,0,1);
}
#login-box > .sign-out-message {
	display: block;
	padding: 10px;
	margin-bottom: 10px;
	font-size: 12px;
	color: red;
	background-color: rgba(255,255,255,0.5);
	border: 1px solid;
}
#login-box > input {
	font-size: 16px;
    padding: 6px 10px;
	margin-bottom: 8px; 
}
#login-box > button {
	font-size: 14px;
	margin-top: 12px;
}


/* Main navigation */
/* -------------------------------------------------- */

#nav {
	position: fixed;
	top: 0;
	width: 100%;
	padding: 0 16px;
	background-color: #303636;
	user-select: none;
	z-index: 2;
}

#nav > li {
    display: inline-block;
    width: 32px;
    height: 46px;
    font-size: 0;
    background-repeat: no-repeat;
    background-size: 80% auto;
    background-position: 50%;
    cursor: pointer;
    opacity: 0.5;
}
#nav > li:hover {
	opacity: 0.8;
}
#nav li.active {
	position: relative;
	opacity: 1;
}
#nav li.active::after {
	content: '';
	position: absolute;
	width: 100%;
	height: 4px;
	bottom: 0px;
	left: 0;
	background-color: #00bcd4;
}

#nav > #section_home		{ background-image: url('img/ic_home_white_48.png'); }
#nav > #section_visits		{ background-image: url('img/ic_timer_white_48.png'); }
#nav > #section_stores		{ background-image: url('img/ic_store_white_48.png'); }
#nav > #section_employees	{ background-image: url('img/ic_person_white_48.png'); }
#nav > #section_products	{ background-image: url('img/ic_business_center_white_48.png'); }
#nav > #section_admin		{ background-image: url('img/ic_settings_white_48.png'); }


#nav li#user-button {
	float: right;
	width: 56px;
	height: 46px;
	margin: 0 -16px 0 0;
	font-size: 0;
	background-image: url('img/ic_account_box_white_48.png');
	background-size: auto 70%;
	background-position: 12px 50%;
	background-repeat: no-repeat;
	cursor: pointer;
	opacity: 0.9;
}
#nav li#user-button:hover {
	opacity: 1;
}
#nav li#user-button.visit {
	background-color: #00c77e;
}
#nav li#user-button.visit .visit-duration {
	position: absolute;
	top: 0;
	right: 72px;
	font-family: 'menlo';
	font-size: 22px;
	line-height: 46px;
	color: #00ffa2;
}

/* User menu */
/* -------------------------------------------------- */

#user-menu {
	display: none;
}
#crm.user-menu-open {
	margin-left: -160px;
}
#crm.user-menu-open #body {
	margin-right: 160px;
}
#crm.user-menu-open #user-menu {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
    background-color: rgba(255,255,255,0.5);
	z-index: 5;
}
#crm.user-menu-open #user-menu ul {
	position: absolute;
	top: 0;
	right: 0;
	width: 160px;
	height: 100%;
	padding: 10px 0;
	background: linear-gradient(90deg, #222 10%, #333);
	border-left: 2px solid rgba(0,0,0,0.75);
}
#crm.user-menu-open #user-menu li {
	display: block;
	font-size: 12px;
	padding: 6px 20px;
	color: rgba(255,255,255,0.7);
	cursor: pointer;
}
#crm.user-menu-open #user-menu li.linebreak {
	padding: 0;
	margin: 10px 0;
	border-bottom: 1px solid rgba(255,255,255,0.2);
	cursor: default;
}
#crm.user-menu-open #user-menu li:hover {
	color: rgba(255,255,255,1);
}


/* Breadcrumb */
/* -------------------------------------------------- */

#breadcrumb {
	position: fixed;
	top: 46px;
	width: 100%;
	padding: 6px 16px;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	font-size: 12px;
	white-space: nowrap;
	background-color: white;
	box-shadow: 0px 2px 1px rgba(0,0,0,0.05);
	z-index: 1;
}
#breadcrumb li {
	display: inline-block;
}
#breadcrumb li+li:before {
	font-weight: bold;
	content: '>';
	color: rgba(0,0,0,0.25);
	padding: 0 8px;
}
#breadcrumb li > span {
	display: inline-block;
	padding: 4px 0;
	text-decoration: underline;
	cursor: pointer;
}
#breadcrumb li:last-child > span {
	color: rgba(0,0,0,0.7);
	text-decoration: none;
	cursor: auto;
}
#breadcrumb li > span:hover {
	color: #ef5a2d;
}
#breadcrumb li:last-child > span:hover {
	color: rgba(0,0,0,0.7);
}


/* General */
/* -------------------------------------------------- */

#body {
	margin: 78px 0;
	overflow: scroll;
}
.action-bar {
	margin: 8px 0;
	padding: 16px;
	border-radius: 8px;
}
.action-bar > button:not(:last-child) {
	margin-right: 16px;
}

/* Table Listview */
/* -------------------------------------------------- */

table.list-view {
	width: 100%;
	margin-top: 16px;
	font-size: 11px;
}
table.list-view thead {
	border-top: 1px solid rgba(0,0,0,0.1);
}
table.list-view th {
	padding: 5px 10px;
	color: rgba(0,0,0,0.7);
	text-align: left;
	text-transform: uppercase;
	font-weight: bold;
}
table.list-view td {
	padding: 8px 10px;
	color: rgba(0,0,0,0.7);
}
table.list-view tr th:first-child,
table.list-view tr td:first-child {
	padding-left: 16px;
}
table.list-view tr th:last-child,
table.list-view tr td:last-child {
	padding-right: 16px;
}
table.list-view tr {
	border-bottom: 1px solid rgba(0,0,0,0.05);
}
table.list-view tbody tr:hover{
	cursor: pointer;
	background-color: rgba(0,188,212,0.1)
}
table.list-view.regions {
	width: initial;
	margin-top: 4px;
}

.order-single > table.list-view tbody tr:hover{
	cursor: default;
	background-color: initial;
}

span.toggle-inactive {
	display: inline-block;
	font-weight: bold;
	padding: 16px;
	color: #018090;
	cursor: pointer;
	user-select: none;
}
span.toggle-inactive:hover {
	color: #005a66;
}

/* Shopping cart */
/* -------------------------------------------------- */

.cart-entries > .action-bar {
	text-align: center;
}
.cart-entries > .action-bar > button:first-of-type {
	margin-right: 10px;
}
.order-details {
	display: block;
	margin: 20px 16px;
}
#cart-list {
	margin-top: 16px;
}
#cart-list > li {
	padding: 7px 0 12px 0;
	border-top: 1px solid rgba(0,0,0,0.1);
	white-space: nowrap;
	cursor: default;
}
#cart-list > li:nth-of-type(odd){
	background-color: rgba(0,0,0,0.025);
}
#cart-list .product-id {
	display: none;
	width: 60px;
	font-size: 14px;
	line-height: 20px;
	vertical-align: top;
	text-align: right;
	color: rgba(0,0,0,0.4);
}
#cart-list > li > .entry-group.group-1 {
	display: block;
	width: 100%;
	padding: 0 16px;
}
#cart-list .product-category {
	display: none;
}
#cart-list .product-name {
	font-size: 11px;
	line-height: 24px;
	margin-bottom: 4px;
	font-weight: bold;
	color: rgba(0,0,0,0.7);
}
#cart-list input.amount {
	display: inline-block;
	width: 36px;
	margin-left: 16px;
	vertical-align: top;
	text-align: right;
}
#cart-list .select-wrapper {
	display: inline-block;
	width: 80px;
	margin-left: 16px;
	vertical-align: top;
}
#cart-list .total {
	position: relative;
	display: inline-block;
	width: 70px;
	margin-left: 15px;
	padding: 4px 2px 3px 2px;
	vertical-align: top;
	font-size: 12px;
	text-align: right;
	color: rgba(0,0,0,0.8);
	border: 1px solid rgba(0,0,0,0.05);
	border-radius: 2px;
}
#cart-list .select-wrapper::after,
#cart-list .total::before {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 16px;
	margin-left: -16px;
	font-size: 12px;
	line-height: 20px;
	text-align: center;
	color: rgba(0,0,0,0.5);
}
#cart-list .select-wrapper::after {
	content: 'x';
}
#cart-list .total::before {
	content: '='
}
#cart-list .remove {
	float: right;
	width: 24px;
	height: 24px;
	margin-top: -1px;
	margin-right: 16px;
	font-size: 0;
	border-radius: 50%;
	background-image: url(img/ic_close_white_48.png);
	background-repeat: no-repeat;
	background-size: 70%;
	background-position: 50% 50%;
	background-color: #000000;
	opacity: 0.25;
	cursor: pointer;
}
#cart-list .remove:hover {
	opacity: 0.5;
}
.cart-sum {
	padding-top: 20px;
	font-weight: bold;
	text-align: center;
	border-top: 1px solid rgba(0,0,0,0.2);
}


/* Visit Single */
/* -------------------------------------------------- */

.visit-single {
	margin: 0 16px;
}

.visit-single .details {
	margin-top: 16px;
}
.visit-single .title {
	display: inline-block;
	margin-bottom: 6px;
	font-size: 18px;
	letter-spacing: 0;
	color: rgba(0,0,0,0.7);
}
.visit-single .id {
	display: inline-block;
	margin-left: 6px;
	font-size: 14px;
	color: rgba(0,0,0,0.25);
	line-height: 18px;
	vertical-align: text-bottom;
}
.visit-single span {
	font-size: 12px;
	line-height: 16px;
	color: rgba(0,0,0,0.6);
}
.visit-single .visitor::after {
	content: '@';
	color: red;
	padding: 0 4px;
}
.visit-single .store-name {
	border-bottom: 1px dashed rgba(0,0,0,0.2);
	cursor: pointer;
}
.visit-single .store-name::after {
	content: ', ';
}
.visit-single .order-info {
	display: block;
	margin-top: 20px;
	padding: 16px;
	color: rgba(255,0,0,0.75);
	background-color: rgba(255, 245, 245, 1);
	border: 1px dashed rgba(255,0,0,0.25);
}
.visit-single .description {
	display: block;
	margin-top: 20px;
}
.visit-single .description::before {
	content: 'Kommentar';
	display: block;
	margin-bottom: 4px;
	font-weight: bold;
}
.visit-single .time-details {
	margin-top: 40px;
	text-align: center;
}
.visit-single .time-details .visit-duration+.visit-started,
.visit-single .time-details .visit-duration+.visit-ended {
	border-left: 1px solid rgba(0,0,0,0.1);
}
.visit-single .time-details .visit-duration {
	padding-right: 16px;
}
.visit-single .time-details .visit-started,
.visit-single .time-details .visit-ended {
	padding-left: 16px;
}
.visit-single .time-details span {
	display: inline-block;
	font-size: 12px;
	color: rgba(0,0,0,0.4);
	text-align: center;
}
.visit-single .time-details .visit-duration.ongoing {
	color: #00b900;
}
.visit-single .time-details .visit-duration::before,
.visit-single .time-details .visit-started::before,
.visit-single .time-details .visit-ended::before {
	display: block;
	margin-bottom: 2px;
	font-size: 10px;
	font-weight: bold;
	color: rgba(0,0,0,0.5);
	text-transform: uppercase;
}
.visit-single .time-details .visit-duration::before {
	content: 'Besökstid';
}
.visit-single .time-details .visit-started::before {
	content: 'Påbörjad';
}
.visit-single .time-details .visit-ended::before {
	content: 'Avslutad';
}
.visit-single > .edit-area {
	display: block;
	margin-top: 20px;
}
.visit-single > .edit-area > label,
.cart-entries > #cart-comment-label {
	display: block;
	margin-bottom: 4px;
	font-size: 12px;
	line-height: 14px;
	color: rgba(0,0,0,0.6);
	font-weight: bold;
}
.visit-single > .edit-area > textarea,
.cart-entries > #cart-comment {
	display: block;
	margin-bottom: 6px;
	width: 100%;
	height: 100px;
	padding: 2px 4px;
	font-size: 12px;
	color: rgba(0,0,0,0.8);
	background-color: rgba(0,188,212,0.04);
	border: 1px solid rgba(0,0,0,0.25);
	border-radius: 2px;
	resize: none;
}
.cart-entries > #cart-comment {
    height: 25px;
    width: 90%;
    margin-left: 16px;
}
.cart-entries > #cart-comment-label {
    margin-left: 16px;
}

.visit-single > .orders {
	display: block;
	margin-top: 20px;
}

.visit-single > .orders::before {
	content: 'Order';
	display: block;
	margin-bottom: 4px;
	font-weight: bold;
}

.visit-single > .orders > .order {
	display: inline-block;
	margin-right: 6px;
	padding: 4px 8px;
	border: 1px solid rgba(0, 0, 0, 0.15);
	background-color: rgba(36, 210, 40, 0.2);
	cursor: pointer;
}
.visit-single > .orders > .order:hover{
	background-color: rgba(36, 210, 40, 0.3);
} 



/* Search area */
/* ---------------------------------------- */

#search-area {
	padding: 16px 0 8px 0;
	border-bottom: 1px solid rgba(0,0,0,0.025);
	background: linear-gradient(rgba(0,0,0,0.05), rgba(0,0,0,0));
}
#form-search {
	display: block;
	padding: 0;
	text-align: left;
	margin: 0 16px;
}
#form-search > .field-group {
	display: inline-block;
	margin: 0;
	width: 100%;
}
.stores #form-search > .field-group {
	width: 80%;
}
#form-search > .field-group > label {
	display: none;
}
#search-search {
	font-size: 16px;
	padding: 8px;
	background-color: white;
	box-shadow: 0px 2px 4px rgba(0,0,0,0.1);
}
#search-submit {
	position: relative;
	margin-left: -32px;
	margin-top: 4px;
	width: 28px;
	height: 28px;
	vertical-align: top;
	background-image: url('img/ic_search_black_48.png');
	background-size: 100%;
}
#search-location {
	position: relative;
	margin-top: 0;
	margin-left: 20px;
	vertical-align: top;
	background-image: url('img/ic_location_on_white_48.png');
	background-size: auto 70%;
	background-repeat: no-repeat;
	background-position: 50%;
	padding: 17px;
	font-size: 0;
}
#search-imp_exp {
	position: relative;
	margin-top: 5;
	margin-left: 40px;
	vertical-align: top;
	padding: 8px 16px 8px 16px;
}
  
#search-product_imp_exp {
	position: relative;
	margin-top: 5;
	margin-left: 40px;
	vertical-align: top;
	padding: 8px 16px 8px 16px;
}
#search-area > .filter-area > .title {
	display: block;
	margin-top: 12px;
	margin-left: 25%;
	margin-right: 25%;
	padding-left: 16px;
	font-size: 11px;
	font-weight: bold;
	color: rgba(0,0,0,0.6);
	cursor: pointer;
	user-select: none;
}
#search-area > .filter-area > .title:hover{
	color: rgba(0,0,0,0.8);
}
#search-area.stores > .filter-area > .title {
	margin-left: 15%;
}
#search-area > .filter-area > .title::before{
	content: '▸';
	padding-right: 5px;
	font-size: 14px;
	vertical-align: middle;
}
#search-area > .filter-area > .title.open::before{
	content: '▾';
	padding-right: 3px;
}
#form-filter {
	display: none;
	width: 80%;
	margin-top: 10px;
	margin-left: 10%;
	padding: 16px 22px;
	border-top: 1px solid rgba(0,0,0,0.1);
	border-radius: 8px;
	background: linear-gradient(rgba(0,0,0,0.025), rgba(0,0,0,0));
}
#form-filter.show{
	display: block;
}
#form-filter > .field-group {
	display: inline-block;
	margin-right: 10px;
	margin-bottom: 10px;
}
#filter-add,
#filter-reset {
	margin-top: 10px;
	padding: 6px 12px 6px 32px;
	background-repeat: no-repeat;
	background-size: auto 70%;
	background-position: 6px 50%;
}
#filter-add {
	background-image: url(img/ic_filter_list_white_48.png);
}
#filter-reset {
	margin-left: 10px;
	background-image: url(img/ic_clear_all_white_48.png);
}


/* Store / Product / Order / Visit list */
/* -------------------------------------------------- */


#store-list > li,
#product-list > li,
#employee-list > li,
#employee-statistics > li,
#order-list > li,
#visit-list > li {
	padding: 5px 0 2px 0;
	border-top: 1px solid rgba(0,0,0,0.1);
	white-space: nowrap;
	cursor: pointer;
}

#store-list-tbody > tr.inactive span,
#product-list > li.inactive span,
#employee-list > li.inactive span,
#employee-statistics > li.inactive span {
	color: rgba(220,0,0,0.6) !important;
}

#store-list-tbody > tr:nth-of-type(odd),
#product-list > li:nth-of-type(odd),
#employee-list > li:nth-of-type(odd),
#employee-statistics > li:nth-of-type(odd),
#order-list > li:nth-of-type(odd),
#visit-list > tr:nth-of-type(odd) {
	background-color: rgba(0,0,0,0.025);
}
#store-list-tbody > tr:hover,
#product-list > li:hover,
#employee-list > li:hover,
#employee-statistics > li:hover,
#order-list > li:hover,
#visit-list > tr:hover {
	background-color: rgba(0,188,212,0.1);
}

#store-list-tbody > tr.selected {
	background-color: rgba(0,188,212,0.25);	
}
#store-list-tbody > tr.selected:hover {
	background-color: rgba(0,188,212,0.35);	
}

#store-list-tbody .store-id,
#product-list > li > .product-id,
#employee-list > li > .employee-id,
#employee-statistics > li > .employee-id,
#order-list > li > .order-id,
#visit-list-tbody .visit-id {
	display: none;
}
#store-list-tbody > tr > .entry-group,
#product-list > li > .entry-group,
#employee-list > li > .entry-group,
#employee-statistics > li > .entry-group,
#order-list > li > .entry-group,
#visit-list-tbody > tr > .entry-group {
	display: inline-block;
	padding: 0 10px;
}
#store-list-tbody > tr > .entry-group.group-1,
#product-list > li > .entry-group.group-1,
#employee-list > li > .entry-group.group-1,
#employee-statistics > li > .entry-group.group-1,
#visit-list-tbody > tr > .entry-group.group-1 {
	padding: 0 10px 0 16px;
}
#store-list-tbody > tr > .entry-group.group-1,
#product-list > li > .entry-group.group-1 {
	width: 60%;
}
#employee-list > li > .entry-group.group-1,
#employee-statistics > li > .entry-group.group-1 {
	width: 140px;
}
#order-list > li > .entry-group.group-1 {
	width: 160px;
}

#store-list-tbody > tr > .entry-group.group-2,
#product-list > li > .entry-group.group-2 {
	width: 40%;
	padding: 0 16px 0 0;
}

#visit-list-tbody > tr > .entry-group.group-2 {
	width: 120px;
}

.choices{
	width: 300px;
}
.choices__input{
	min-width: 100%;
}

#store-list-tbody .store-name,
#product-list > li > .entry-group > .product-name,
#employee-list > li > .entry-group > .employee-name,
#employee-statistics > li > .entry-group > .employee-name,
#order-list > li > .entry-group > .order-employee,
#visit-list .visit-employee {
	font-weight: bold;
}
#store-list-tbody .store-name,
#store-list-tbody .store-address,
#store-list-tbody .store-region,
#store-list-tbody .store-zipcity,
#store-list-tbody .store-distance,
#store-list-tbody .store-lastvisit,
#product-list > li > .entry-group > .product-name,
#product-list > li > .entry-group > .product-category,
#product-list > li > .entry-group > .product-in-stock,
#product-list > li > .entry-group > .product-price,
#product-list > li > .entry-group > .product-unit,
#employee-list > li > .entry-group > .employee-name,
#employee-list > li > .entry-group > .employee-role,
#employee-statistics > li > .entry-group > .employee-name,
#employee-statistics > li > .entry-group > .employee-role,
#order-list > li > .entry-group > .order-employee,
#order-list > li > .entry-group > .order-created,
#order-list > li > .entry-group > .order-sum,
#order-list > li > .entry-group > .order-store,
#visit-list-tbody .visit-started,
#visit-list-tbody .visit-ended,
#visit-list-tbody .visit-employee,
#visit-list-tbody .visit-duration,
#visit-list-tbody .visit-store,
#visit-list-tbody .visit-city {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
}

#store-list-tbody .store-name,
#store-list-tbody .store-region,
#product-list > li > .entry-group > .product-name,
#product-list > li > .entry-group > .product-price,
#employee-list > li > .entry-group > .employee-name,
#employee-statistics > li > .entry-group > .employee-name,
#order-list > li > .entry-group > .order-employee,
#order-list > li > .entry-group > .order-sum,
#visit-list-tbody.visit-employee,
#visit-list-tbody.visit-count,
#visit-list-tbody.visit-store {
	font-size: 12px;
	line-height: 18px;
	color: rgba(0,0,0,0.7);
}
#store-list-tbody .store-address,
#store-list-tbody .store-zip,
#store-list-tbody .store-city,
#store-list-tbody .store-lastvisit,
#product-list > li > .entry-group > .product-category,
#product-list > li > .entry-group > .product-in-stock,
#product-list > li > .entry-group > .product-unit,
#employee-list > li > .entry-group > .employee-role,
#employee-statistics > li > .entry-group > .employee-role,
#order-list > li > .entry-group > .order-created,
#order-list > li > .entry-group > .order-store,
#visit-list-tbody .visit-started,
#visit-list-tbody .visit-ended,
#visit-list-tbody .visit-duration,
#visit-list-tbody .visit-city {
	font-size: 11px;
	line-height: 16px;
	color: rgba(0,0,0,0.5);
}

#visit-list-tbody .visit-started,
#visit-list-tbody .visit-ended {
    min-width: 68px;
}

.spriority {
    line-height: 1.1;
    font-size: 80%;
    padding: 1px 4px 2px;
    background-color: #eeeeee;
    border-radius: 2px;
    color: #1d1d1d;
    vertical-align: middle;
}
#store-list-tbody .spriority {
    line-height: 1.1;
    font-size: 80%;
    padding: 1px 4px 2px;
    border-radius: 2px;
    vertical-align: middle;
}
.store-single > .details .spriority {
    margin-top: 6px;
    margin-right: 10px;
    margin-left: 10px;
    padding: 4px 6px;
    font-size: 10px;
    border-radius: 4px;
}
.spriority.p1 {
  background-color: #60a917;
  color: #ffffff;
}
.spriority.p2 {
  background-color: #1ba1e2;
  color: #ffffff;
}
.spriority.p3 {
  background-color: #fa6800;
  color: #ffffff;
}
.spriority.p4 {
  background-color: #ce352c;
  color: #ffffff;
}

.store-results-title,
.product-results-title,
.order-results-title,
.visit-results-title {
	text-align: center;
	padding: 30px 0 10px 0;
	font-size: 12px;
	font-weight: bold;
	color: rgba(0,0,0,0.8);
}
.store-results-title > .location {
	display: block;
	margin-top: 4px;
	font-size: 11px;
	color: #008799;
}

.store-results-end,
.product-results-end,
.order-results-end,
.visit-results-end {
	display: none;
	text-align: center;
	padding-top: 16px;
	font-size: 12px;
	font-weight: bold;
	border-top: 1px solid rgba(0,0,0,0.1);
}
.store-results-end.visible,
.product-results-end.visible,
.order-results-end.visible,
.visit-results-end.visible {
	display: block;
}




#employee-list,
#employee-statistics {
    margin-top: 16px;
}
#employee-list > li.title,
#employee-statistics > li.title {
	padding: 0;
	background: none;
	border: 0;
	cursor: default;
}
#employee-list > li.sum,
#employee-statistics > li.sum {
	background: none;
	border-top: 1px solid #00BCD4;
	cursor: default;
}
#employee-list > li.title span,
#employee-statistics > li.title span {
	display: inline-block;
	font-weight: bold;
}
#employee-list > li.sum span,
#employee-statistics > li.sum span {
	display: inline-block;
}
#employee-list > li.title > .entry-group,
#employee-statistics > li.title > .entry-group {
	padding: 0;
}
#employee-list > li.sum > .entry-group > span,
#employee-statistics > li.sum > .entry-group > span {
	display: block;
}

#employee-list > li.title > .employees,
#employee-list > li.sum > .totals,
#employee-statistics > li.title > .employees,
#employee-statistics > li.sum > .totals {
	width: 140px;
	font-size: 0;
}
#employee-list > li.title .visits,
#employee-statistics > li.title .visits {
	display: block;
	text-align: center;
	color: rgba(0,0,0,0.5);
	margin-bottom: 8px;
}

#employee-list > li.title .visit-count,
#employee-statistics > li.title .visit-count {
	width: 70px;
	padding: 0px 5px 4px 5px;
	text-align: right;
	font-size: 12px;
	color: rgba(0,0,0,0.6);
	border-left: 1px solid rgba(0, 0, 0, 0.05);
	vertical-align: top;
}

#employee-list > li .group-today,
#employee-list > li .group-week,
#employee-list > li .group-month,
#employee-list > li .group-quarter,
#employee-list > li .group-year,
#employee-list > li .group-total,
#employee-statistics > li .group-period {
	display: inline-block;
	width: 78px;
	margin: -5px 0 -2px 0;
	padding: 8px 4px;
	text-align: right;
	font-size: 12px;
	line-height: 27px;
	color: rgba(0,0,0,0.7);
	border-left: 1px solid rgba(0, 0, 0, 0.05);
	vertical-align: top;
}
#employee-list > li .group-month,
#employee-list > li .group-quarter,
#employee-list > li .group-year,
#employee-list > li .group-total,
#employee-statistics > li .group-period {
    width: 78px;
}

#employee-list > li .visit-count,
#employee-list > li .order-sum,
#employee-statistics > li .visit-count,
#employee-statistics > li .order-sum {
	display: block;
	line-height: 14px;
    width: 100%;
}
#employee-list > li .visit-count,
#employee-statistics > li .visit-count{
	margin-right: 8px;
	font-weight: bold;
}

#employee-list > li .group-year,
#employee-list > li .group-quarter,
#employee-list > li .group-total,
#employee-list > li.sum .group-year,
#employee-list > li.sum .group-quarter,
#employee-list > li.sum .group-total,
#employee-list > li .group-visit-intervals > .group-year,
#employee-list > li .group-visit-intervals > .group-quarter,
#employee-list > li .group-visit-intervals > .group-total,
#employee-statistics > li .group-total,
#employee-statistics > li.sum .group-total,
#employee-statistics > li .group-visit-intervals > .group-total{
	display: none;
}


/* Map */
/* -------------------------------------------------- */

.map-canvas {
	display: none;
	width: 100%;
	height: 200px;
	background-color: #EEEEEE;
}
.map-canvas.show{
	display: block;
	margin-bottom: 20px;
}
.map-canvas.not-found{
	display: block;
	height: initial;
	padding: 16px;
	font-size: 11px;
	line-height: 14px;
	color: rgba(255,0,0,0.75);
	background-color: rgba(255, 245, 245, 1);
	border: 1px dashed rgba(255,0,0,0.25);
}
.map-canvas.not-found > .title {
	display: block;
	font-weight: bold;
	margin-bottom: 6px;
}
.map-canvas.not-found > .description {
	display: block;
}
.map-canvas.not-found > button {
	margin-top: 6px;
}


/* Store / Product / Employee single */
/* -------------------------------------------------- */

.store-single,
.product-single,
.employee-single,
.order-single {
	position: relative;
	padding: 1px;
	padding-top: 16px;
	font-size: 12px;
}
.store-single > .cover-image,
.product-single > .cover-image {
	display: inline-block;
	width: 120px;
	height: 90px;
	margin: 0 20px 0 16px;
	border-radius: 4px;
	border: 1px solid rgba(0,0,0,0.1);
	background-color: rgba(0,0,0,0.1);
	background-size: 102% auto;
	background-repeat: no-repeat;
	background-position: 50%;
}
.product-single > .cover-image {
	margin-bottom: 20px;
}
@media screen and (max-width: 390px) and (min-width: 320px) {
    .product-single > .cover-image {
        margin-bottom: calc(390px - 80vw);
    } 
}
.store-single > .details,
.product-single > .details {
	position: absolute;
	top: 16px;
	left: 150px;
}
.employee-single > .details {
	padding: 0 16px;
}
.store-single > .details > .cc {
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-right: 4px;
	vertical-align: top;
	font-size: 0;
	background-image: url('img/ic_star_blue_48.png');
	background-repeat: no-repeat;
	background-size: 120%;
	background-position: 50%
}
.store-single > .details > .title,
.product-single > .details > .title,
.employee-single > .details > .title {
	display: inline;
	font-size: 14px;
	letter-spacing: 0;
}
.store-single > .details > .id,
.product-single > .details > .id,
.employee-single > .details > .id {
	display: inline-block;
	margin-left: 6px;
	font-size: 12px;
	line-height: 14px;
	color: rgba(0,0,0,0.25);
	vertical-align: text-bottom;
}
.product-single > .details > .category,
.employee-single > .details > .level {
	display: block;
	text-transform: uppercase;
	font-size: 10px;
	line-height: 12px;
	font-weight: bold;
	color: rgba(0,0,0,0.6);
}
.store-single > .details > .address {
	display: block;
	margin-top: 4px;
	font-size: 11px;
	line-height: 14px;
	color: rgba(0,0,0,0.6);
}
.store-single > .details > .region-label {
	display: inline-block;
	margin-top: 6px;
	margin-right: 10px;
	padding: 4px 6px;
	font-size: 10px;
	border-radius: 4px;
	border: 1px solid;
}
.store-single > .details > .price-group {
	display: inline-block;
	width: 20px;
	height: 20px;
	line-height: 20px;
	color: white;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	border-radius: 50%;
	vertical-align: bottom;
}
.store-single > .details > .price-group.pga {
	background-color: #4caf50;
}
.store-single > .details > .price-group.pgb {
	background-color: #6aaf50;
}
.store-single > .details > .price-group.pgc {
	background-color: #88af50;
}
.store-single > .details > .price-group.pgd {
	background-color: #a6af50;
}

.product-single > .details > .product-details,
.employee-single > .details > .contact-details {
	margin-top: 6px;
	font-size: 11px;
	line-height: 14px;
	color: rgba(0,0,0,0.6);
}
.employee-single > .details > .contact-details span {
	display: block;
}
.product-single > .details > .product-details > .missing-price {
	color: #cc0000;
	margin-top: 10px;
}

.product-details > .price-table > .pg-row {
	border-top: 1px solid rgba(0,0,0,0.1);
}
.product-details .pg-row,
.product-details > .price-table > .pg-row {
	line-height: 16px;
}
.product-details .pg-row > span {
	display: inline-block;
}
.product-details .pg-row > .label {
	width: 45px;
	text-align: right;
}
.product-details .pg-row > .price {
	width: 60px;
	text-align: right;
}
.product-details .pg-row > .tax-price {
	width: 70px;
	text-align: right;
	opacity: 0.8;
}
.product-details .pg-row > .discount {
	width: 40px;
	text-align: right;
	font-weight: bold;
}
.group-start,
.group-ended,
.group-products {
	margin:16px;
	font-size: 16px;
	color: rgba(0,0,0);
}
.group-start > .start-value,
.group-ended > .end-value,
.group-products > .products-value{
	font-size: 14px;
	color: rgba(0,0,0,0.7);
}

.store-single > .main-details {
	padding: 16px;
	border-bottom: 1px solid rgba(0,0,0,0.1);
}
.store-single > .main-details > .equipment,
.store-single > .main-details > .owner,
.store-single > .main-details > .pricecategory,
.store-single > .main-details > .openhours {
	display: inline-block;
	margin-right: 24px;
	vertical-align: top;
}
.store-single > .main-details > .equipment > .title,
.store-single > .main-details > .equipment > .humidor,
.store-single > .main-details > .equipment > .refrigerator,
.store-single > .main-details > .owner > .title,
.store-single > .main-details > .owner > .name,
.store-single > .main-details > .owner > .phone,
.store-single > .main-details > .pricecategory > .title,
.store-single > .main-details > .pricecategory > .prioritet,
.store-single > .main-details > .pricecategory > .basprioritet,
.store-single > .main-details > .openhours > .title,
.store-single > .main-details > .openhours > .hours {
	display: block;
	font-size: 11px;
	line-height: 14px;
	color: rgba(0,0,0,0.6);
}
.store-single > .main-details > .equipment > .title,
.store-single > .main-details > .owner > .title,
.store-single > .main-details > .pricecategory > .title,
.store-single > .main-details > .openhours > .title {
	margin-bottom: 2px;
	font-weight: bold;
	color: rgba(0,0,0,0.8);
}
.store-single > .main-details .status-true {
	color: #00a000;
}
.store-single > .main-details .status-false {
	color: #a00000;
}



/* Order single */
/* -------------------------------------------------- */

.order-single {
	min-width: 400px;
}


.order-single .heading {
	margin: 0 16px 16px 16px;
}
.order-single .heading .title {
	display: inline;
	font-size: 18px;
	letter-spacing: 0;
}
.order-single .heading .id {
	display: inline-block;
	margin-left: 6px;
	font-size: 14px;
	line-height: 18px;
	color: rgba(0,0,0,0.25);
	vertical-align: text-bottom;
}


.order-single > .details {
	padding: 16px;
}

.order-single > .details > .customer {
	display: inline-block;
	vertical-align: top;
}

.order-single > .details > .customer > .label {
	font-size: 10px;
	font-weight: bold;
	margin-bottom: 4px;
	color: rgba(0,0,0,0.8);
}

.order-single > .details > .customer > .name {
	font-size: 14px;
	line-height: 20px;
	font-weight: bold;
	color: rgba(0,0,0,0.7);
}
.order-single > .details > .customer > .id {
	margin-left: 6px;
	font-size: 13px;
	line-height: 20px;
	color: rgba(0,0,0,0.3);
}

.order-single > .details > .customer > .address,
.order-single > .details > .customer > .zip,
.order-single > .details > .customer > .city {
	font-size: 12px;
	line-height: 18px;
	color: rgba(0,0,0,0.6);
}

.order-single > .details > .customer > .label,
.order-single > .details > .customer > .address {
	display: block;
}
.order-single > .details > .customer > .name,
.order-single > .details > .customer > .id,
.order-single > .details > .customer > .zip,
.order-single > .details > .customer > .city {
	display: inline-block;
}
.order-single > .details > .customer > .city {
	margin-left: 6px;
}




.order-single .time-seller {
	display: inline-block;
	vertical-align: top;
	margin-left: 64px;
}

.order-single .time-seller .group {
	margin-bottom: 10px;
}

.order-single .time-seller .group span {
	display: block;
}

.order-single .time-seller .label {
	font-size: 10px;
	font-weight: bold;
	margin-bottom: 7px;
	color: rgba(0,0,0,0.8);
}
.order-single .time-seller .value {
	font-size: 12px;
	color: rgba(0,0,0,0.6);
}

.order-single .sub-title {
	display: block;
	margin: 32px 16px 8px 16px;
	font-size: 10px;
	font-weight: bold;
	color: rgba(0,0,0,0.8);
}

.order-single li {
	font-size: 12px;
	padding: 8px 16px;
	border-top: 1px solid rgba(0,0,0,0.1);
}

.order-single li .price-details {
	text-align: right;
}

.order-single li .unit-box {
	opacity: 0.5;
}

.order-single li .totals-box {
	display: inline-block;
	border-top: 1px solid rgba(0,0,0,0.05);
	opacity: 0.8;
}

.order-single li .name {
	display: inline-block;
	margin-bottom: 4px;
	font-size: 14px;
	font-weight: bold;
	color: rgba(0,0,0,0.7);
}
.order-single li .id {
	display: inline-block;
	margin-left: 6px;
	font-size: 13px;
	color: rgba(0,0,0,0.3);
}


.order-single li .total-label,
.order-single li .unit-labe,
.order-single li .unit-price,
.order-single li .unit-tax,
.order-single li .unit-price-tax,
.order-single li .total-price,
.order-single li .total-tax, 
.order-single li .total-price-tax {
	display: inline-block;
	text-align: right;
	font-size: 12px;
	line-height: 20px;
}

.order-single li .total-label,
.order-single li .unit-label {
	width: 60px;
	font-weight: bold;
}

.order-single li .unit-price,
.order-single li .unit-tax,
.order-single li .unit-price-tax {
	width: 90px;
	margin-left: 8px;
}

.order-single li .total-price,
.order-single li .total-tax, 
.order-single li .total-price-tax {
	width: 90px;
	margin-left: 8px;
}

.order-single li .amount::before,
.order-single li .unit-price::before,
.order-single li .unit-tax::before,
.order-single li .unit-price-tax::before {
	display: block;
	font-size: 10px;
	font-weight: bold;
	color: rgba(0,0,0,0.6);
}
.order-single li .amount::before {
	content: 'Antal';
}
.order-single li .unit-price::before {
	content: 'Exkl. moms';
}
.order-single li .unit-tax::before {
	content: 'Moms';
}
.order-single li .unit-price-tax::before {
	content: 'Inkl. moms';
}


.order-single > .sum-box {
	text-align: right;
	border-top: 1px solid rgba(0,0,0,0.4);
}

.order-single > .sum-box .sum {
	display: inline-block;
	padding: 16px;
	font-size: 12px;
	line-height: 18px;
}
.order-single > .sum-box .sum .label {
	width: 100px;
	color: rgba(0,0,0,0.5);
}
.order-single > .sum-box .sum .value {
	width: 100px;
	color: rgba(0,0,0,0.7);
	text-align: right;
}
.order-single > .sum-box .sum tr:last-child {
	font-weight: bold;
}

.order-single .order-history-box .loading {
	font-weight: bold;
	padding: 20px 5px;
	text-align: center;
	color: var(--text-loading);
}
.order-single .order-history-box .loading::before {
	content: 'Loading...';
}
.order-single .order-history-box .status {
	color: var(--text-color);
}
.order-single .order-history-box .comment {
	color: var(--text-color);
}
.order-single .order-history-box .user {
	color: var(--text-muted);
}

.order-single > #form-action {
	display: block;
	margin-top: 32px;
	border-radius: 8px;
	background-color: rgba(0,0,0,0.05);
}
.order-single > #form-action > .field-group {
	display: inline-block;
	margin-right: 16px;
}
.order-single > #form-action > .order-comment {
	width: calc(100% - 230px);
}



/* Order list */
/* -------------------------------------------------- */

.orders-filter,
.visits-filter {
	text-align: center;
	padding: 16px 0 8px 0;
    border-bottom: 1px solid rgba(0,0,0,0.025);
    background: linear-gradient(rgba(0,0,0,0.05), rgba(0,0,0,0));
}

#form-order-filter > .field-group,
#form-visit-filter > .field-group {
	display: inline-block;
	margin-right: 10px;
	margin-bottom: 10px;
}




/* New user */
/* -------------------------------------------------- */
.employee-new {
	padding: 16px;
	font-size: 12px;
	line-height: 14px;
}
.employee-new > .title {
	display: block;
	font-weight: bold;
	margin-bottom: 6px;
}
.new-user-details {
	display: inline-block;
	margin-top: 10px;
	padding: 20px;
	border: 1px solid rgba(0,0,0,0.2);
	background-color: rgba(255,255,0,0.1);
	user-select: text;
}
.prop-group {
	font-size: 11px;
	line-height: 22px;
}
.prop-group > .prop {
	display: inline-block;
	width: 100px;
	margin-right: 5px;
	text-align: right;
	font-weight: bold;
}
.prop-group > .value {
	padding: 2px 8px;
	font-size: 12px;
	font-family: monospace;
	background-color: rgba(128,128,0,0.1);
}

/* Collapse-list */
/* -------------------------------------------------- */

.collapse-list {
	margin: 8px 0;
	/* font-size: 11px; */
	border: 1px solid rgba(0,0,0,0.1);
	border-bottom: 1px solid rgba(0,0,0,0.1);
	border-radius: 4px;
}
.collapse-list > .title {
	display: block;
	padding: 8px 16px;
	font-size: 13px;
	font-weight: bold;
}
.collapse-list > .none {
	display: inline-block;
	padding: 0px 16px 12px 16px;
}
.collapse-list > ul {
	display: none;
	padding: 0 8px;
}
.collapse-list.images > ul {
	padding: 8px;
	border-top: 1px solid rgba(0,0,0,0.1);
	margin: 0 8px;
}
.collapse-list.show > ul {
	display: block;
}
.collapse-list > ul > li {
	padding: 12px 8px;
	border-top: 1px solid rgba(0,0,0,0.1);
	cursor: pointer;
}
.collapse-list > ul > li:hover {
	background-color: rgba(0,188,212,0.1);
}
.collapse-list > ul > li.more-visits {
	padding: 10px;
	font-weight: bold;
	text-align: center;
}
.collapse-list > ul > li.more-visits:hover {
	background: none;
}
.collapse-list.info > ul > li {
	cursor: default;
}
.collapse-list.info > ul > li:hover {
	background-color: initial;
}
.collapse-list.images > ul > li {
	display: inline-block;
	width: 70px;
	height: 70px;
	margin: 1px;
	padding: 0;
	text-align: center;
	vertical-align: top;
	background-color: rgba(0,0,0,0.05);
	border: none;
}
.collapse-list.images > ul > li > img {
	max-width: 70px;
	max-height: 70px;
	cursor: pointer;
}
.collapse-list > ul > li > span {
	display: block;
}

.collapse-list > ul > li > .ended {
	margin-bottom: 8px;
	color: rgba(0,0,0,0.5);
}
.collapse-list > ul > li > .name {
	font-weight: bold;
	margin-bottom: 4px;
	color: rgba(0,0,0,0.8);
}
.collapse-list > ul > li > .description {
	line-height: 14px;
	color: rgba(0,0,0,0.7);
}
.collapse-list > ul > li > .duration {
	margin-top: 8px;
	color: rgba(0,0,0,0.4);
}


/* Info box */
/* -------------------------------------------------- */

.info-box {
	display: inline-block;
	font-size: 11px;
	line-height: 14px;
}
.info-box > .title {
	display: block;
	margin-bottom: 4px;
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	color: rgba(0,0,0,0.8);
}
.info-box > table > tr > td:nth-of-type(1){
	padding-right: 8px;
	color: rgba(0,0,0,0.7);
}
.info-box > table > tr > td:nth-of-type(2){
	color: rgba(0,0,0,0.6);
}


/* Edit details */
/* -------------------------------------------------- */

.edit-details {
	margin-top: 20px;
	padding: 12px 0;
	text-align: center;
	color: rgba(0,0,0,0.4);
}
.edit-details > .entry {
	display: inline-block;
	padding: 0 24px;
	text-align: center;
}
.edit-details > .entry+.entry {
	border-left: 1px solid rgba(0,0,0,0.1);
}
.edit-details > .entry > span {
	display: block;
	margin-bottom: 2px;
}
.edit-details > .entry > .context {
	margin-bottom: 4px;
	font-size: 10px;
	font-weight: bold;
	text-transform: uppercase;
	color: rgba(0,0,0,0.5);
}
.edit-details > .entry > .time {
	margin-bottom: 4px;
	font-size: 12px;
}
.edit-details > .entry > .user {
	font-size: 11px;
	font-style: italic;
}


/* Edit view */
/* -------------------------------------------------- */

.edit-view {
	display: inline-block;
	padding: 16px;
}

.edit-view > .title,
.edit-view > .ss-box > .title {
	display: block;
	margin-bottom: 16px;
	font-size: 12px;
	font-weight: bold;
	color: rgba(0,0,0,0.8);
}

.edit-view > .field-group,
.edit-view > .ss-box > .field-group {
	margin-bottom: 16px;
}
.edit-view > .field-group > label,
.edit-view > .ss-box > .field-group > label {
	display: block;
	padding: 0 0 3px 5px;
	font-size: 11px;
	font-weight: bold;
	text-align: left;
	color: rgba(0,0,0,0.6);
}
.edit-view > .field-group > input:disabled,
.edit-view > .ss.box > .field-group > input:disabled {
	opacity: 0.5;
}

.edit-view > .ss-box {
	margin: 0 -16px 16px -16px;
	padding: 16px;
	background-color: #f8f8f8;
	border: 1px solid rgba(0,0,0,0.1);
}


/* Overlay */
/* -------------------------------------------------- */

#overlay {
	position: fixed;
	display: none;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 3;
}
#overlay.show {
	display: block;
}
#overlay > .box {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 4%;
	border-radius: 8px;
	background-color: white;
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
	padding: 40px;
	text-align: center;
}
#overlay > .bg {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.5);
	z-index: -1;
}
#overlay > .box{
	margin: auto;
	position: absolute;
	width: 30%;
	height: 50%;
}

#overlay > .box > .content {
	width: 100%;
	height: 100%;
}
#overlay > .box > .content > a > img.full {
	max-width: 100%;
	max-height: 80%;
	box-shadow: 0 0 10px rgba(0,0,0,0.2);
	outline: 1px solid rgba(0,0,0,0.25);
	outline-offset: -1px;
}
#overlay > .box > .content > span.caption {
	display: block;
	margin-top: 10px;
	font-size: 11px;
}
#overlay > .box > .content > .actions {
	margin-top: 20px;
}
#overlay > .box > .content > .actions > button+button {
	margin-left: 20px;
}

#overlay > .box .title {
	display: block;
	margin-bottom: 16px;
	font-size: 14px;
	font-weight: bold;
	color: rgba(0,0,0,0.7);
}

#overlay > .box .error {
	display: none;
	max-width: 300px;
	margin: 0 auto 8px auto;
	padding: 16px;
	font-size: 12px;
	color: rgba(255,0,0,0.75);
	background-color: rgba(255, 245, 245, 1);
	border: 1px dashed rgba(255,0,0,0.25);
}
#overlay > .box .error.show {
	display: block;
}

@media screen and (max-width: 750px) {
	#overlay > .box {
		width: 70%;
	}
  }

#form-password-change label {
	text-align: left;
}
#import-form-file{
	display: none
}
#import-form-error{
	padding: 5px;
	display: flex
}
#visit-filter-imp_exp {
	margin:16px;
	padding: 8px 16px 8px 16px;
	font-size: 12px;
}
#order-filter-order_imp_exp{
	margin:16px;
	padding: 8px 16px 8px 16px;
	font-size: 12px;
}

/* Admin view */
/* -------------------------------------------------- */

.admin-view {
	padding: 16px;
	font-size: 12px;
}
.clickable {
	text-decoration: underline;
	cursor: pointer;
}


/* Region editor */
/* -------------------------------------------------- */

#region-editor {
	display: inline-block;
	width: 100%;
	padding: 20px 16px;
	border-bottom: 1px solid rgba(0,0,0,0.2);
}
#region-editor > .title {
	display: block;
	margin-bottom: 12px;
	font-size: 14px;
	font-weight: bold;
}
#region-editor > .input-group {
	display: inline-block;
}
#region-editor > .input-group:first-of-type {
	width: 200px;
}
#region-editor > .input-group > label {
	display: block;
	margin-bottom: 6px;
	font-size: 12px;
	font-weight: bold;
	color: rgba(0,0,0,0.75);
}
#region-label {
	padding: 4px 8px;
}
#region-editor > .input-group > input[type='color'] {
	width: 80px;
	opacity: 0;
}
#region-editor > .input-group > .color-selector {
	width: 80px;
	height: 25px;
	margin-top: -24px;
	border: 1px solid rgba(0,0,0,0.25);
	background-color: red;
}
#region-editor > button {
	display: block;
	margin-top: 18px;
}





/* Special user case */
/* -------------------------------------------------- */

.access-5 > #nav > li {
	display: none;
}
.access-5 > #nav > li#user-button {
	display: inline-block;
}
/*
.access-5 > #breadcrumb {
	top: 0;
}
*/





.admin-tools {
	padding: 16px;
	border-bottom: 1px solid rgba(0,0,0,0.025);
    background: linear-gradient(rgba(0,0,0,0.05), rgba(0,0,0,0));
}
.employee-tools{
	padding: 16px;
	border-bottom: 1px solid rgba(0,0,0,0.025);
    background: linear-gradient(rgba(0,0,0,0.05), rgba(0,0,0,0));
}

.admin-tools > .multi-select,
.admin-tools > .ms-action, .ms-changeactiveaction {
	padding: 6px 10px !important;
	font-size: 13px !important;
}

.admin-tools > .multi-select {
	width: 120px;
}

.admin-tools > .multi-select.active {
	background-color: #f44336;
	box-shadow: none;
}

.admin-tools > .arrow {
	display: none;
	width: 30px;
	height: 30px;
	line-height: 30px;
	vertical-align: top;
	font-size: 18px;
	text-align: center;
	color: rgba(0,0,0,0.5);
}
.admin-tools > .arrow.active {
	display: inline-block;
}

.admin-tools > .info {
	display: none;
	margin-left: 40px;
	padding: 8px 10px;
	font-size: 13px;
	background-color: rgba(0,188,212,0.15);
	border-radius: 2px;
	text-decoration: underline;
	color: #0099ad;
	cursor: pointer;
}
.admin-tools > .info.active {
	display: inline-block;
}
.admin-tools > .info.active.none {
	display: inline-block;
	text-decoration: none;
	color: rgba(0,0,0,0.5);
	background-color: transparent;
	pointer-events: none;
}

.admin-tools > .ms-action, .ms-changeactiveaction {
	display: none;
}
.admin-tools > .ms-action.active, .ms-changeactiveaction.active {
	display: inline-block;
}

.admin-tools > .ortext {
	display: none;
    margin: 5px;
}
.admin-tools > .ortext.active {
	display: inline-block;
}







.order-amount-editor {
	display: inline-block;
	margin-right: 20px;
	vertical-align: top;
	border-radius: 2px;
	box-shadow: 0 2px 4px rgba(0,0,0,0.25);
}

.order-amount-editor > input {
	display: inline-block;
	width: 60px;
	padding: 5px 8px;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	border-left: none;
	border-right: none;
	border-radius: 0;
}
.order-amount-editor > input:focus{
	border-left: none;
	border-right: none;
}

.order-amount-editor > .decrease,
.order-amount-editor > .increase {
	display: inline-block;
	width: 33px;
	height: 33px;
	vertical-align: top;
	background-color: #00bcd4;
	border: 1px solid rgba(0,0,0,0.2);
	color: white;
	text-align: center;
	font-weight: bold;
	font-size: 26px;
	line-height: 28px;
	cursor: pointer;
	user-select: none;
}
.order-amount-editor > .decrease:hover,
.order-amount-editor > .increase:hover {
	background-color: #00cfeb;
}

.order-amount-editor > .decrease {
	border-top-left-radius: 2px;
	border-bottom-left-radius: 2px;
}
.order-amount-editor > .increase {
	border-top-right-radius: 2px;
	border-bottom-right-radius: 2px;
}




#store-list tr > *:nth-child(1),
#store-list tr > *:nth-child(3),
#store-list tr > *:nth-child(4),
#store-list tr > *:nth-child(5),
#visit-list tr > *:nth-child(1),
#visit-list tr > *:nth-child(3),
#visit-list tr > *:nth-child(5),
#visit-list tr > *:nth-child(7) {
    display: none;
}


.boxclose {
    float: right;
    margin: 6%;
    position:relative;
    cursor: pointer;
    color: #fff;
    border: 1px solid #AEAEAE;
    border-radius: 30px;
    background: #605F61;
    font-size: 31px;
    font-weight: bold;
    display: block;
    line-height: 0px;
    padding: 11px 3px;
}





.pagination {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    text-align: center;
}

.entry-group .group-3 {
	display:flex;
	padding: 0;
}

#product-list > li > .entry-group > .product-in-stock {
	display: flex;
	padding: 0 10px 0 16px;
}

#crm ul > li > .stock-group{
	display: flex;
	padding: 0px;
}