:root{
	--accent:198, 133, 35;
	--round:4px;
	--background:#F8F9FD;
	--card:#FFF;
	--text-color:#6b7c93;
	--box-shadow:0 0 0 1px #d8e1ed;
	--abstract-text:#000;
	--btn-text:#FFF;
	--border-color:#e7edf3;
	--input-border-color:#d0dbe5;
	--input-background:#FBFCFD;
	--drop-shadow:rgba(0,0,0,.1);
}
body.dark{
	--background:#10101a;
	--card:#171725;
	--text-color:#879ebd;
	--abstract-text:#FFF;
	--border-color:#252538;
	--input-border-color:#383851;
	--btn-text:#000;
	--box-shadow:0 0 0 1px #252538;
	--input-background:#1e1e2f;
	--drop-shadow:rgba(0,0,0,.5);
}
body{
	background-color:var(--background);
}
body.dark .selector.active{
	background-color:#1F2948;
}
::selection{
	background:rgba(var(--accent),.5);
}.login-background{
	position:absolute;
	background-color:rgb(var(--accent));
	inset:0;
	
}.editlist-prices{
	
	user-select:none;
	
}
.editlist-prices .nested{
	flex:auto;
	width:100%;
	margin-bottom:0;
	z-index:2;
}
.editlist-prices .pricebtn{
	margin-right:10px;
	background-color:var(--card);
	border-top-left-radius:0;
	border-top-right-radius:0;
	box-shadow: var(--box-shadow);
	z-index:1;
	margin:-10px 0px;
}

.widget-spreadsheet div.siblings{
	gap:0;
}

.widget-spreadsheet .cell{
	width: 0;
    flex: 1;
	margin: 0 !important;
	position:relative;
	z-index:1;
}
.widget-spreadsheet .hcell{
	padding: 13px 15px;
    box-shadow: 0px 0px 0px 1px var(--input-border-color);
    font-weight: bold;
	box-sizing:border-box;
	margin: 0.5px !important;
}
.widget-spreadsheet .cell>input{
    width:100%;
	height:40px;
	border:0;
    box-shadow: 0px 0px 0px 1px var(--input-border-color);
	outline:none;
	box-sizing:border-box;
	padding: 0 15px;
	background-color: var(--input-background);
	color:var(--abstract-text);
}

.widget-spreadsheet .cell>input.invalid{
	box-shadow: 0px 0px 0px 1px red;
}

.widget-spreadsheet .cell:focus-within{
	z-index:2;
}
.widget-spreadsheet .cell>input:focus{
	box-shadow: 0px 0px 0px 2px rgb(var(--accent));	
}
.widget-spreadsheet .cell>span{
	position:absolute;
	pointer-events:none;
	margin-top:11px;
	margin-left:6px;
}
.widget-spreadsheet .cell>span.post{right:6px;}

.widget-options>.active{
	
	color:rgb(var(--accent));
	background-color:rgba(var(--accent), 0.1);
	box-shadow:inset 0 0 0 2px rgb(var(--accent))!important;
}.disabled{pointer-events:none;}

.card{
	background-color:var(--card);
	border-radius:var(--round);
	box-shadow:var(--box-shadow);
	position:relative;
	overflow:hidden;
	transition:0.2s;
	margin-bottom:16px;
}
.card.hollow{
	background:none;
}
.card.background{
	background-color:var(--background);
}
.click{
	cursor:pointer;
	transition:0.3s!important;
	position:relative;
}
.click:hover,.click-block:hover{
	z-index:1;
	box-shadow:0 0 0 2px rgb(var(--accent))!important;
	transition:0s!important;
}

.card-group{border-radius:var(--round);position:relative;}

.card-group .card-group{box-shadow:none;}

.card-group>.card{
	border-radius:0;
	margin-bottom:1px;
}
.card-group>.card:first-child,.card-group>:not(.card) + .card{
	border-top:0;border-top-left-radius:var(--round);border-top-right-radius:var(--round);
}
.card-group>.card:last-child{border-bottom-left-radius:var(--round);border-bottom-right-radius:var(--round);}

.card>.nav{padding-top:16px;padding-bottom:16px;}

.card-split{
	margin:12px 0px;
	border-bottom: solid 1px var(--border-color);
}

.expand{
	overflow-x:unset;
	transition:0.2s;
}

.loader{
	position:absolute;
	inset:0;
	background-color:inherit;
	margin:0!important;
	border-radius:var(--round);
	display:flex;
	align-items:center;
	justify-content: center;
	transition:0.2s;
	opacity:0;
}
.loader.show{opacity:1;}
.loader:after{
	content:"";
	width:10px;
	height:10px;
	border:solid 2px rgb(var(--accent));
	border-radius:99px;
	border-top-color:transparent;
	animation:spin 1s linear infinite;
}
.btn>.loader:after{border-color:#FFF;border-top-color:transparent;}

.text{
	margin:8px 0;
}

p{margin:0 0 7px 0;}

.heading{
	font-size:20px;
	margin-bottom:5px;
	color:var(--abstract-text);
}
.heading.S{font-size:15px;}
.heading.L{font-size:25px;}

.dialog{
	position:fixed;
	inset:0;
	z-index:100;
	transition:0.2s;
	opacity:0;
	backdrop-filter: blur(4px);
}
.dialog.side{
	backdrop-filter:none;
	pointer-events:none;
}

.dialog.side>.screencenter>.container{
	margin-right:0;
	pointer-events:auto;
}

.dialog>.screencenter>.container>.card{margin-bottom:0px;}

body.dark .dialog>.screencenter>.container{
	box-shadow: 0 18px 100px 15px rgba(0, 0, 0, .8);
}
.dialog>.screencenter>.container{
	box-shadow: 0 18px 100px 15px rgba(16,16,32, .15);
}

.dropdown{
	position:fixed;
	top:0;
	left:0;
	z-index:150;
	transition:opacity 0.2s;
	margin-top:10px;
	box-shadow:0 28px 60px var(--drop-shadow);
}

.dropdown:before{
	    content: "";
    transform: rotate(45deg);
    border: solid 1px var(--border-color);
    z-index: 1;
    position: absolute;
    left: 50%;
    top: -5px;
    margin-left: -6px;
    box-shadow: var(--box-shadow);
    clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 100%);
    width: 10px;
    height: 10px;
    background: var(--card);
}
.dropdown>.card{margin-bottom:0;}

.dialog.show{
	opacity:1;
}

.tag{
    color: rgb(var(--accent));
    background-color: rgba(var(--accent),.1);
    padding: 4px 8px;
    margin: 4px 0;
    display: inline-block;
    border-radius: 3px;
	font-weight:bold;
	position:relative;
	display:inline-flex;
	align-items: center;
	box-sizing: border-box;
}
.tag.dot:before {
    content: "";
    border-radius: 5px;
    z-index: 1;
	margin-right:6px;
	border:solid 2px;
}

.tag.hollow{
	background-color: var(--background);
    color: var(--abstract-text);
    font-weight: normal;
}

.tag.S{
	opacity: 0.7;
    font-size: 9pt;
}

.alert{
	padding: 9px 12px;
    font-weight: bold;
    border-radius: var(--round);
    border-left: solid 3px;
	background-color: var(--background);
}

.tabs{
	margin-bottom:8px;
}

.tabs>a{
	color:var(--text-color);
	opacity:0.7;
	transition:0.2s;
}
.tabs.block>a.btn{
	display:block;
	text-align:center;
	width:180px;
	align-self: stretch;
}

.tabs.block>a.btn>*{
	display:block;
	width:100%;
	text-wrap: wrap;
}
.tabs.block>a.btn>i{
	font-size:40px;
}
.tabs.block>a.btn>label{
	font-size:20px;
}
.tabs.boxed{
	gap:0;
}
.tabs.boxed>a{
	box-shadow: 0 0 0 1px var(--text-color);
    border: 0;
    margin-right: 1px;
	border-radius:0;
	padding: 7px 12px;
}
.tabs.boxed>a:first-child{
	border-top-left-radius:5px;
	border-bottom-left-radius:5px;
}
.tabs.boxed>a:last-child{
	border-top-right-radius:5px;
	border-bottom-right-radius:5px;
}
.tabs>a:hover{
	color:rgb(var(--accent));
	opacity:1;
}
.tabs>a.active{
	color:rgb(var(--accent));
	background-color: rgba(var(--accent),.1);
	opacity:1;
	box-shadow: 0 0 0 1px rgb(var(--accent));
}
.tabs .btn.add{
	border-style:dashed;
	width:unset!important;
}

.tabs>a.disabled{color:#b8c3d3;}

.tabs.rich>a{display:block;text-align:center;}

.selection>div{
	width:200px;
	transition:0.3s;
	cursor:pointer;
}

.selection>div>i{
	font-size:40px;
	color:rgb(var(--accent));
	margin:20px 0;
}

.selection .heading{
	color:rgb(var(--accent));
}

.tooltip{
	position: absolute;
    bottom: calc(100% + 8px);
    background-color: #000;
    color: #FFF;
    padding: 6px 11px;
    border-radius: var(--round);
	pointer-events:none;
	opacity:0;
	transition:0.2s;
}
.tooltip:after {
    content: "";
    transform: rotate(45deg);
    border: solid 6px #000;
    z-index: -1;
    position: absolute;
    left: 50%;
    bottom: -5px;
    margin-left: -6px;
}

.has-tooltip:hover>.tooltip{opacity:1;}

[color='blue']{background-color:rgba(9, 111, 206, 0.1);color:rgb(9, 111, 206);}
[color='grey']{background-color:rgba(82, 133, 155,.1);color:rgb(82, 133, 155);}
[color='green']{background-color:rgba(48, 167, 117,.1);color:rgb(48, 167, 117);}
[color='yellow']{background-color:rgba(183,135,49,.1);color:rgb(183,135,49);}
[color='red']{background-color:rgba(197,22,46,.1);color:rgb(197,22,46);}
[color='purple']{background-color:rgba(118, 41, 165,.1);color:rgb(118, 41, 165);}

.checkout-dot{
	width:70px!important;
	height:47px;
	border-radius:5px;
	box-shadow:0 3px 6px rgba(0,0,0,.15);
	text-align:center;
	padding-top:3px;
	display:inline-block;
}
.checkout-dot>div{height:15px;}
.checkout-dot>div:before{
	content:"";
	width:30px;
	margin-right:10px;
	display:inline-block;
	height:6px;
	margin-bottom:5px;
	background-color:var(--custom);
	border-radius:99px;
	opacity:0.6;
	vertical-align:middle;
}
.checkout-dot>div:after{
	content:"";
	vertical-align:middle;
	width:10px;
	display:inline-block;
	height:10px;
	margin-bottom:5px;
	background-color:var(--custom);
	border-radius:99px;
}
.checkout-dot>a{
    background-color: var(--custom);
    border-radius: 99px;
    display: block;
    height: 12px;
    margin: 0 9px;
	position:relative;
}
.checkout-dot>a:before{content:"BUY";font-size:8px;color:#FFF;position:absolute;width:100%;left:0;margin-top:1px;}


.wrapflex.text-copy{
    overflow: hidden;
    overflow-wrap: anywhere;
}

img.preview{
	width:100px;
	height:100px;
	object-fit: cover;
	border-radius:4px;
}

.list>div{
	padding-top:8px;
	padding-bottom:6px;
	border-bottom:solid 2px var(--background);
}
.list>div:last-child{
	border-bottom:0;
}

.element-detail{
	
}

.element-detail>div{
	width:246px;
}

.element-detail>div:last-child{border:0;}

.element-detail>div>div{
	font-weight:bold;
	margin-bottom:10px;
	display:block;
}

.selector{
	border-bottom:solid 2px rgb(var(--accent));
	cursor:pointer;
	overflow:unset;
	z-index:1;
	color:rgb(var(--accent));
}
.selector>div{
	color:var(--text-color);
}
.selector>.heading{
	color:rgb(var(--accent));
}
.selector.active{
	background-color: #D8E3FD;
}

.selector.active:after{
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    background-color: inherit;
    border: solid 2px rgb(var(--accent));
    border-width: 2px 0 0 2px;
    bottom: -7px;
    left: 50%;
    margin-left: -7px;
    transform: rotate(-135deg);
    clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 100%);
}

.breadcrum{
    padding: 2px 6px;
    position: absolute;
    top: 21px;
    z-index: 10;
}

.sidebar-contents:not(.open) .breadcrum{
	margin-left:40px;
}

.steps{
	margin-bottom:15px;
	align-items: baseline;
}
.steps>div{
	padding:6px;
	position:relative;
}

.steps>div:not(:last-child):after{
	content:"keyboard_arrow_right";
	font-family:"Material Symbols Outlined";
	position:absolute;
	right:-7px;
}

.steps>div.focus>span{
	color:rgb(var(--accent));
	font-weight:bold;
}

.steps>.focus~ div span{
	background-color:var(--background);
	color:var(--text-color);
}
.steps>.focus div{
	color:rgb(var(--accent));
}

.breadcrum>span{
	display:inline-block;
	margin:0;
	text-transform: capitalize;
}
.breadcrum>span:after{
	content:"/";
	margin:0 0 0 8px;
	font-weight:bold;
}
.breadcrum>span:last-child{
	color:rgb(var(--accent));
}
.breadcrum>span:last-child:after{
	content:"";
}

@media only screen and (max-width: 400px) {
	
	.element-detail>div{
		width:100%;
		margin-right:0!important;
		border-right:0;
	}
	
}

@media only screen and (max-width: 750px) {
	
	.steps span{
		padding: 3px 7px;
        font-size: 10pt;
	}
	.steps span:after{
		top: 11px;
		margin-left: 27%;
        width: 52%;
	}
	.steps div{
		font-size:8pt;
	}
	
	.breadcrum{
		position:unset;
		padding: 8px 0;
		margin-left:0px!important;
	}
	
}.btn{
	padding:4px 12px;
	white-space: nowrap;
	position: relative;
	text-decoration: none;
	cursor:pointer;
	border-radius:8px;
	border:solid 2px transparent;
	
	transition:0.2s;
	display:inline-flex;
	align-items:center;
	user-select:none;
	justify-content: center;
	box-sizing: border-box;
	
}
.btn.hollow{
	background-color:var(--input-background);
	border:solid 1px var(--border-color);
	color:var(--text-color);
}
.btn.solid{
	background-color:rgb(var(--accent));
	color:var(--btn-text);
}
.btn:not(.solid):hover{
	background-color: rgba(var(--accent),.1);
	transition:0s;
}
.btn.solid:hover{
	background-color:rgba(var(--accent),0.8);
	transition:0s;
}
.btn>*{margin-left:2px;margin-right:2px;pointer-events:none;}

.btn>.complete{
	position:absolute;
	inset:0;
	background-color:#FFF;
	border:solid 2px #36C69C;
	margin: -6px -2px;
    border-radius: 6px;
	color:#36C69C;
	display:inline-flex;
	justify-content: center;
	align-items:center;
}

.btn small{color:var(--text-color);}

.btn.S{
	padding:1px 6px;
}
.btn>i{
	font-size: 22px;
}
.btn>i:last-child{
	margin-right:-4px;
	margin-left:3px;
}
.btn>i:first-child{
	margin-right:3px;
	margin-left:-4px;
}
.btn>i:first-child:last-child{
	margin-right:-4px;
	margin-left:-4px;
}

.inputwrap{
	margin-bottom:10px;
	flex:1;
}

.inputwrap.connected{
	margin:0;
	
}
.inputwrap.connected .wrapflex{
	border-radius:0;
	margin-bottom:-1px;
}

.inputwrap.connected .wrapflex:last-child{
	border-bottom-width:1px;
	border-bottom-left-radius:var(--round);
	border-bottom-right-radius:var(--round);
}

.input-under{
	display: flex;
    justify-content: space-between;
}

.inputwrap .wrapflex{
	border:solid 1px var(--input-border-color);
	border-radius:var(--round);
	position:relative;
	display:flex;
	align-items:center;
	transition:0.2s;
	padding:0 14px;
	background-color:var(--input-background);
}
.inputwrap.focus .wrapflex{
	border-color:rgb(var(--accent));
}
.inputwrap .wrapflex>.input{
	background:none;
	border:0;
	outline:0;
	padding:12px 0;
	font-family: 'Muli', sans-serif;
	box-sizing:border-box;
	min-height: 100%;
    width: 100%!important;
	color: var(--abstract-text);
}

select option{
	background-color:var(--background);
}

input.input::-webkit-calendar-picker-indicator{
	-webkit-appearance: none;
	appearance: none;
	display: none;
}

.inputwrap.readonly .wrapflex{
	background-color:#f5f8fb;
	border-color:transparent;
}

.inputwrap .checkboxflex{
	display:flex;
	align-items:center;
}
.inputwrap .checkboxflex>.input{position:absolute;display:none;}
.inputwrap .checkboxflex>a{
	border: solid 1px var(--border-color);
    display: inline-block;
    padding: 0px 2px;
    margin-right: 9px;
    border-radius: var(--round);
	color:transparent;
	transition:0.2s;
	user-select:none;
}
.checkboxflex>a>i{font-size:17pt;pointer-events:none;    margin-top: 1px;}
.checkboxflex>a.checked{background-color:rgb(var(--accent));border-color:transparent;}
.checkboxflex>a.checked>i{color:#FFF;}

.inputwrap.slide{
	max-width:65px;
	margin-bottom:0;
}

.inputwrap.slide .checkboxflex{
    flex-wrap: wrap;
    justify-content: center;
}

.inputwrap.slide .checkboxflex>a{
	width: 100%;
    border-radius: 99px;
	height:24px;
	position:relative;
	background-color:var(--background);
	margin-bottom:4px;
	margin-right:0;
	max-width: 50px;
}
.inputwrap.slide .checkboxflex>a.checked{
	background-color:rgb(var(--accent));
}

.inputwrap.slide .checkboxflex>a>i{display:none;}

.inputwrap.slide .checkboxflex>a:after{
	content:"";
	position:absolute;
	background-color:var(--btn-text);
	border-radius:99px;
	width:16px;
	height:16px;
	top:3px;
	left:4px;
	margin-left: 0;
	transition:0.3s;
	border: solid 1px var(--border-color);
}
.inputwrap.slide .checkboxflex>a.checked:after{
	left:100%;
	margin-left: -20px;
}

.inputwrap.slide label{
	font-size: smaller;
}

form.disabled .inputwrap{
	opacity:0.3;
	pointer-events:none;
}
form.disabled .btn{pointer-events:none;}

.wrapflex>i{
	padding: 0 13px;
	pointer-events:none;
	transition:0.2s;
}
.wrapflex>i.fix-right{
	position: absolute;
    right: 0px;
    pointer-events: none;
}
.wrapflex>span{pointer-events:none;}
.wrapflex.focus>i{color:rgb(var(--accent));}
.inputwrap.error .wrapflex{border-color:rgb(255,0,0);}

.inputwrap .form-error{
	color:red;
	opacity:0;
	transition:0.2s;
}
.inputwrap.error .form-error{opacity:1;}


.footer{
	position:sticky;
	transition:0s!important;
	bottom:0;
}

@media screen and (min-width:600px){
	.form-siblings .inputwrap{display:flex;}
	.form-siblings .inputwrap>label{width:130px;margin-top: 10px;text-align:right;}
	.form-siblings .inputwrap>div{padding-left:20px;flex:1;}
	
	.form-siblings .form-default .inputwrap{display:block!important;}
	.form-siblings .form-default .inputwrap>div{padding-left:0px;}
	
}


.media-input{
	border:dashed 2px var(--border-color);
	padding:20px;
	overflow:hidden;
	position:relative;
	text-align:center;
	border-radius: 4px;
	transition:0.2s;
}

.media-input>i{
    font-size: 40px;
    color: rgb(var(--accent));
    border: solid 1px var(--border-color);
    border-radius: 99px;
    padding: 20px;
    margin: 20px 0;
    display: inline-block;
	
}



.media-input.clickable:hover{
	border-color:rgb(var(--accent));
	cursor:pointer;
	transition:0s;
}

.media-input img{
	max-height: 200px;
	border-radius:5px;
}

.media>.card{
	width:150px;
	height:230px;
	cursor:pointer;
	border:solid 2px var(--card);
	overflow:hidden;
}

.media>.card:hover{
	border-color:rgb(var(--accent));
}

.media .image{
	width:100%;
	height:150px;
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.media .upload{
	
	position:relative;
	background-color:var(--card);
}

.media .upload>div{
	text-align:center;
	color:rgb(var(--accent));
	pointer-events:none;
}
.media .upload>input{
	position:absolute;
	margin:-500px;
	width:500%;
	height:500%;
	cursor:pointer;
}

.media .upload>div>i{font-size:50px;display:block;margin: 41px 0 0;}.columns{
	display:flex;
	justify-content:space-between;
}
.columns>div{
	width:100%;
	box-sizing: border-box;
}

a{
	cursor:pointer;
	color:rgb(var(--accent));
}
.placeholder{
	text-align:center;
	padding:20px 0;
}
.placeholder>i{
	color:rgb(var(--accent));
	font-size: 90pt;
	margin-bottom:10px;
}

.pad{padding:16px;}

.pb{padding-bottom:15px;}
.mb{margin-bottom:15px;}

@media screen and (min-width:799px){
	::-webkit-scrollbar {width: 6px;}
	::-webkit-scrollbar-thumb{background: #d7e1ea;}
}
@media screen and (max-width:800px){
	.columns{
		display:block;
	}
	.columns>div{
		width:auto;
	}
	.screencenter.max-small{padding:0;}
	
	/*.siblings:not(.stay) .grow{flex:unset;width:100%!important;}*/
}.ql-editor{
    background: var(--input-background);
    border: solid 1px var(--input-border-color);
    border-radius: 5px;
}
.ql-tooltip{
    z-index:1000;
}
.ql-tooltip{
    background-color:#000!important;
}
.ql-tooltip-arrow{
    border-color:#000!important;
}

.ql-editor{
    line-height:2!important;
    overflow: unset!important;
}

.ql-editor .button{
    display:block;
    text-align: center;
    
    background-color:rgb(var(--accent));
    color:var(--background);
    padding: 6px;
    border-radius: 6px;
    margin-bottom:6px;
}
.ql-editor .button>a{
    text-decoration: none!important;
    color:var(--background);
    font-weight:bold;
}
.ql-button{
    color:#CCC;
    margin-top: -2px;
}
.ql-button:after{
    content:"capture";
    font-family:"Material Symbols Outlined";
    font-size: 14pt;
    vertical-align: top;
    
}.total{
    flex:0 1 220px;
    text-align: center;
    height: 170px;
    padding-top: 28px;
    box-sizing: border-box;
    margin:0;
}
.total>*{
    display:block;
}
.total>i {
    font-size: 34pt;
    color: rgb(var(--accent));
}
.total>span:last-child{
        font-size: 29pt;
    color: var(--abstract-text);
}.sidebar{
	width:250px;
	height:100%;
	position:absolute;
	left:-250px;
	transition:0.2s;
	z-index:20;
	box-shadow:var(--box-shadow);
	background-color:var(--card);
	box-sizing:border-box;
}
body>.sidebar{position:fixed;}
.sidebar.super{
	position:fixed;
	top:0;
	width:100%;
	max-width:420px;
	left:-420px;
	z-index:125;
}

.sidebar>.menu-btn{
	position:absolute;
	right:-47px;
	top:6px;
	padding:6px 8px;
	background-color:rgba(var(--accent),.2);
	color:rgb(var(--accent));
	border-radius:var(--round);
	transition:0.2s;
	z-index:100;
}
.sidebar>.menu-btn>i{font-size:17pt;margin-top: 2px;}
.sidebar>.menu-btn>i:after{content:"menu";}

.sidebar .scroller{padding-top:36px;box-sizing: border-box;width:100%;}

.sidebar .scroller>.nav>.card{
	margin:20px;
}
.sidebar .scroller>.nav>.card:after{
	content:"launch";
	font-family:"Material Symbols Outlined";
	position:absolute;
	top:5px;
	right:5px;
	color:rgb(var(--accent));
	font-size:14pt;
}

.sidebar.super .scroller{padding:20px;}

.sidebar-contents{
	top:0;
	left:0;
	right:0;
	background-color:var(--background);
	position:relative;
	min-width:250px;
	transition:0.2s;
	box-sizing: border-box;
	min-height:100%;
	padding:10px;
}
body>.sidebar-contents{
	position:absolute;
	padding-top: 70px;
}

.sidebar.open{left:0px;}
.sidebar-contents.open{margin-left:250px;}

.sidebar.open>.menu-btn{right:6px;}
.sidebar.open>.menu-btn>i:after{content:"west";}

.topbar{
	height:60px;
	position:fixed;
	top:0;
	right:0px;
	background-color:var(--background);
	width: 100%;
    text-align: right;
	z-index:10;
	margin:0 10px;
	display: flex;
    justify-content: right;
}
.nav .group{
	position:relative;
}
.nav>.group{
	margin-left:0;
	padding:0 20px;
	border-bottom:dashed 1px var(--border-color);
}

.nav .group>a{
	padding:12px 6px;
	display:flex;
	align-items:center;
	margin:2px 0;
	font-weight:bold;
	color:var(--abstract-text);
	cursor:unset;
}

.nav .items>a,.nav>a{
	padding:10px 6px;
	display:flex;
	align-items:center;
	color:var(--text-color);
	transition:0.2s;
	border-radius:var(--round);
	margin:2px 0;
	text-decoration:none;
}
.sidebar .nav>a{
	margin:2px 20px;
}
.nav a.disabled{opacity:0.4;}

.nav a>i{margin-right:10px;color:rgb(var(--accent));}

.nav>.group>a{
	cursor:pointer;
	transition:0.2s;
	border-radius:5px;
	position:relative;
}

.nav .group .heading{
	margin: 10px 0px;
	letter-spacing:1px;
	font-size:8pt;
	font-weight:bold;
	color:rgb(var(--accent));
}

.nav a.active,.nav .items>a:hover,.nav>a:hover{
	background-color:rgba(var(--accent),.1);
	color:rgb(var(--accent));
}
.nav .group>a.active:not(:hover){
	color:var(--abstract-text);
	background:none;
	
}
.nav .items{
	padding-left:16px;
}
.nav>.group>.items{
	padding-left:34px;
	position:relative;
	overflow:hidden;
	transition:0.2s;
	max-height:0;
	
}
.nav>.group.open{
	padding:0 20px;
}
.nav>.group.open>.items{
	max-height:450px;
	margin-bottom:10px;
}
.nav>.group>a:after{
	position:absolute;
	content:"keyboard_arrow_right";
	font-family:"Material Symbols Outlined";
	right:5px;
	font-size:13pt;
}
.nav>.group>a:hover{
	opacity:0.5;
}
.nav>.group.open>a:after{
	transform:rotate(90deg);
}
.nav .items.addons{
	padding-left:0;
	display:inline-flex;
	flex-wrap:wrap;
	width:100%;
}

.nav .items.addons > a{
	width:33%;
	text-align:center;
	display:block;
	font-size:9pt;
	padding:7px 0;
	box-sizing:border-box;
}

.addon{
	background-color: rgb(var(--accent));
    color: #FFF;
    border-radius: 5px;
	padding: 2px;
	box-sizing:border-box;
}

.addon.L{
	
	font-size: 40px;
	width:50px;
	height:50px;
	text-align:center;
}
.addon>img{
	max-width:50px;
	max-height:40px;
}
.addon.material-symbols-outlined{
	padding-top:4px;
}
.nav>.group>.items:before{
	content: "";
    position: absolute;
    width: 3px;
    left: 16px;
    top: 0px;
    bottom: 0px;
    background-color: rgba(var(--accent),.2);
	border-radius:5px;
}
.nav>.group .group>.items:before{
    content: "";
    position: absolute;
    width: 11px;
    left: -15px;
    top: 13px;
    background-color: rgba(var(--accent), .2);
    border-radius: 5px;
    height: 3px;
}
.sidebar .addon{
	position: absolute;
    right: 6px;
    padding: 4px;
	font-size:16px;
}

.tabs .addon{display:none;}

.nav>.card>.text-center{
	width:calc(100% + 40px);
	margin-bottom:5px;
}
.nav>.card>.btn>i{
	font-size: 15pt;
}

.apps>div{
	cursor:pointer;
	margin:1px;
	padding:6px;
	border-radius:5px;
	transition:0.2s;
}
.apps>div:hover{
	background-color:rgba(255,255,255,.05);
	transition:0s;
}
.apps>div>.material-symbols-outlined{
	padding: 6px;
    margin: 6px;
}

@media screen and (max-width: 750px){
	body.dark .sidebar.open{
		box-shadow: -100px 0px 50px 100px rgba(8, 8, 16, .8);
	}
	.sidebar.open{
		box-shadow: 0 0 100px rgba(16, 16, 32, .15);
	}
	.sidebar-contents:after{
		content:"";
		left:0;
		top:0;
		bottom:0;
		right:0;
		position:absolute;
		z-index: 10;
		transition:0.2s;
		backdrop-filter: blur(4px);
		pointer-events:none;
		opacity:0;
	}
	.sidebar-contents.open{margin-left:0px;}
	
	.sidebar-contents.open:after{
		right: 0%;
		opacity:1;
		pointer-events:auto;
	}
}.calendar{
	padding-bottom:5px;
	margin:1px;
}
.calendar>.siblings{margin-bottom:5px;}
.calendar .grid>div{
    width: calc(14.28% - 1px);
    padding: 5px;
    display: inline-block;
    vertical-align: top;
    transition: 0.2s;
    box-shadow: 0 0 0 1px #ced6e1;
    margin: 0.5px;
    text-align:center;
    box-sizing: border-box;
}
.calendar .grid>div.day{
	color:rgb(var(--accent));
	
	min-height: 77px;
}
.calendar .grid>div.outer{
	color:#bcc4cf;
}
.calendar .grid>div>*{display:block;}

.calendar .timeslots>*{display:flex;margin-bottom:2px;}
.calendar .timeslots .btn{padding:1px;}
.calendar .timeslots .siblings>*{margin:0;}
.calendar .timeslots .card{padding:0;}.chart canvas{
	
	width:100%;
	height:500px;
	
}.colorpicker{
	display:inline-block;
	width:30px;
	height:25px;
	border-radius:99px;
	box-shadow:0 0 0 1px #d8e1ed;
	border:solid 5px white;
	background-color:blue;
	font-size: 20px;
	color:#FFF;
	text-align:center;
	padding-top:5px;
	cursor:pointer;
}
.colorpicker:after{
		content:"colorize";
	font-family:'Material Symbols Outlined';
}
.colorpicker:hover{
	box-shadow:0 0 0 1px rgb(var(--accent));
}

.colorpicker_dropdown .color_item{
	border:solid 2px white;
	outline:solid 2px white;
	display:inline-block;
	width:18px;
	height:18px;
	margin:-1px 0px;
	border-radius:99px;
	cursor:pointer;
	transition:0.2s;
	z-index:1;
	position: relative;
}
.colorpicker_dropdown .color_item:hover,.colorpicker_dropdown .color_item.active{
	outline-color:rgb(var(--accent));
	transition:0s;
	z-index:2;
}.datalist{
	
	
	
}

.datalist .headings>div{
	font-weight:bold;
	margin-bottom:0;
	padding:10px 0px;
}
.datalist .headings>div:last-child{border-right:0;}

.datalist .grid{
	
}

.datalist .grid>div{
	
	border-top:solid 1px var(--border-color);
	opacity:1;
	transition:0.2s;
	pointer-events:auto;
}
.datalist .grid>div.animate{
	opacity:0;
	pointer-events:none;
}
.datalist .grid>div>div{
	padding: 10px 0px;
}
.datalist .grid>div.clickable:hover{
	cursor:pointer;
	transition:0s;
	background-color:var(--background);
}

.datalist .filter{
	margin-bottom:15px;
}

.datalist .filter>*,.datalist .filter .inputwrap{
	margin-bottom:0;
}
@media screen and (max-width:500px){
	
	.datalist .grid>div,.datalist .headings{
		flex-wrap: nowrap;
	}
	
	.datalist .grid>div>div,.datalist .headings>div{
		width:33%;
		flex:unset;
	}
	
	.datalist .grid>div>div:nth-child(n+4),.datalist .headings>div:nth-child(n+4){
		display:none;
	}
	
}.datepicker{
	max-width:300px;
}
.datepicker .grid>div{
	width: 14.28%;
	padding:8px 0;
	display:inline-block;
	vertical-align:top;
	text-align:center;
	border-radius:var(--round);
	transition:0.2s;
}
.datepicker .grid>div.day{
	cursor:pointer;
	color:rgb(var(--accent));
}
.datepicker .grid>div.day:not(.active):hover{
	transition:0s;
	background-color: rgba(var(--accent),.2);
}
.datepicker .grid>div.outer{
	color:#bcc4cf;
}
.datepicker .grid>div.locked{
	color:#bcc4cf;
	pointer-events:none;
}
.datepicker .grid>div.active,.datepicker .nav a.active{
	background-color: rgb(var(--accent));
	color:#FFF;
}
.datepicker .nav{
	overflow:auto;
}
.datepicker .clock{
	color: #FFF;
    background-color: rgb(var(--accent));
    text-align: center;
    padding: 8px 0;
    font-size: 16px;
    margin-bottom: 9px;
    border-radius: var(--round);
}
.datepicker .day.fill{
	background-color: rgba(var(--accent),.1);
	margin:2px 0;
	border-radius:0;
}

.datepicker .day.fill.start{
	border-top-left-radius:100px;
	border-bottom-left-radius:100px;
}
.datepicker .day.fill.end{
	border-top-right-radius:100px;
	border-bottom-right-radius:100px;
}.editlist{
	box-shadow:none;
	touch-action: pan-y;
}

.editlist .siblings.fixed>.btn{width:auto!important;}

.editlist.drag-state{
	pointer-events:none;
}

.card .editlist{
	margin:2px;
}

.drag-handle{
    width: 32px!important;
    height: 50px;
    position: relative;
    cursor: move;
    cursor: grab;
	display: flex;
    align-items: center;
	transition:0.2s;
	border-radius:5px;
	color:rgba(var(--accent),.5);
}
.drag-handle>i{
	font-size: 25pt;
}
.drag-handle:hover,.dragging>.drag-handle{
	box-shadow:var(--box-shadow);
	color:rgb(var(--accent));
}

.dragging{
	position:absolute;
	transition:0s!important;
	box-sizing: border-box;
	z-index:1000;
	pointer-events:none;
	width:100%;
	max-width:500px;
	box-shadow:var(--box-shadow)!important;
}
.dragging.return{
	transition:0.2s!important;
	max-width:1000px;
}

.dragging>*:not(.drag-keep,.drag-handle){
	display:none;
}

.drop-placeholder{border:dashed 2px transparent;height:0;transition:0.1s;margin:-2px 0;}
.drop-placeholder.show{border-color:rgb(var(--accent));background-color:rgba(var(--accent),.3);height:50px;margin:0;}.gallery{
	justify-content:center;
}
.gallery>div{
	height:100px;
	background-size: cover;
	background-position: center;
	cursor:pointer;
	max-width:150px;
}
.gallery>div:hover{

}
.gallery-full{
	overflow:hidden;
	border-radius:5px;
	position:relative;
	user-select:none;
	max-height:100%;
}
.gallery-full>img{
	max-width:100%;
	margin-bottom: -3px;
}
.gallery-full>.btn{
	position: absolute;
    left: 10px;
    top: 10px;
	background-color:var(--background);
	color:rgb(var(--accent));
}
.gallery-full>div{
	position: absolute;
    top: calc(50% - 15px);
    right: 10px;
    background: var(--background);
    border-radius: 99px;
    width: 30px;
    height: 30px;
    padding-top: 3px;
	padding-left:4px;
    box-sizing: border-box;
	cursor:pointer;
	transition:0.2s;
	user-select:none;
}
.gallery-full>div:hover{
	transform:scale(1.1);
}
.gallery-full>div.left{
	right:unset;
	left:10px;
	padding-left:3px;
}.mapview{
    cursor:crosshair;
    overflow:hidden;
    position:relative;
}
.mapview>.cursor{
    position:absolute;
    padding:2px 6px;
    margin-left:-42px;
    transition:0s;
}

.mapview .button{
    pointer-events:none;
    position:absolute;
}
.mapview .button>div{
    font-size:2vw;
    margin-left: -50%;
    background: rgba(255,255,255,.8);
    border:solid 1px var(--line);
    color:#000;
    font-weight:bold;
    display: inline-block;
    padding:4% 10%;
    border-radius:4px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .3);
    pointer-events:auto;
    transition:0.2s;
}
.mapview .button>div:hover{
    transform:scale(1.05);
    background: rgba(255,255,255,1);
}
.mapview .button>div:after{
    content:"BOOK NOW";
    float:right;
    font-size:8pt;
    pointer-events:none;
}
.preview{
	--pre-border:#e7edf3;
}

.preview.onlinepage .render{
	width:900px;
	min-height:500px;
}

.preview.checkout .render{
	width:350px;
}

.preview.checkout{
	background-color:#FFF;
}

.preview.checkout.dark{
	background-color:#121416;
	--pre-border:#24282c;
	--pre-text:#94a9c5;
}

.render{
	transform-origin:0 0;
	
}

.preview.onlinepage{
	background-color:#FCFCFD;
	overflow-y: scroll;
    overflow-x: hidden;
}

.preview.onlinepage .header{
	padding:10px;
	border-bottom:solid 1px var(--pre-border);
	text-align:right;
}
.preview.onlinepage .pre-footer{
	padding:10px;
	border-top:solid 1px var(--pre-border);
	text-align:right;
}
.preview.onlinepage .content i{
	color: rgb(var(--accent));
}
.preview.onlinepage .content{
	margin:0 40px;
	border:solid 1px var(--pre-border);
	border-width:0 1px;
	align-items: flex-start;
	line-height: 1.5;
}

.preview.onlinepage .mapview{
	padding:6px;
	padding-bottom:2px;
}
.preview.onlinepage .mapview>iframe{border-radius:6px;}

.preview.onlinepage .banner{
	overflow: hidden;
    position: relative;
    margin: 0 40px;
	max-height: 600px;
}
.preview.onlinepage .banner>img{
	width: 100%;
    margin: auto;
    z-index: 1;
}

.preview.onlinepage .social>img{
	width: 30px;
    height: 30px;
    display: inline-block;
    background-color: rgb(var(--accent));
    vertical-align: top;
    padding: 7px;
    box-sizing: border-box;
    border-radius: 99px;
    margin: 3px;
}

.preview .pre-btn{
	display: inline-flex;
	background-color: rgb(var(--accent));
	padding:6px 12px;
	color:#FFF;
	border-radius:5px;
}

.preview.checkout{
	text-align:center;
	border-radius:5px;
	border:solid 1px var(--pre-border);
	width:300px;
}
.preview.checkout .pre-btn{
	margin:10px;
	display:block;
}
.preview.checkout .heading{
	color:rgb(var(--accent));
}

.preview .pre-steps{
	margin:10px; auto;
	display:inline-block;
	border:solid 1px var(--pre-border);
	border-radius:5px;
	padding:0 6px;
}
.preview .pre-steps>span{
	display:inline-block;
	padding:4px 11px;
}

.preview .ticket{
	text-align:left;
	padding:15px;
	border-bottom:solid 1px var(--pre-border);
	color:var(--pre-text);
}

.preview.onlinepage .card{
	box-shadow: 0 17px 8px -15px var(--drop-shadow);
    background-color: var(--card);
    border: solid 1px var(--pre-border);
    border-radius: 12px;
}

.preview h1{
	margin:0;
	color: rgb(var(--accent));
}

.preview .pre-btn>span{
	align-self: center;
}.schedule-list .month-label{
    padding: 4px 12px;
    display:inline-block;
    text-align: center;
	border:solid 1px var(--border-color);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: var(--text-color);
	border-width: 1px 1px 0 1px;
}
.schedule-list .group{
	transition:opacity 0.3s;
}.multistatus{
	padding:6px;
	border-radius:4px;
	border:solid 1px #d8e1ed;
	transition:0.2s;
	position:relative;
}
.multistatus:hover{
	border-color:rgb(var(--accent));
	transition:0s;
}
.multistatus>div{
	font-size:12px;
}
.multistatus:after{
	content:"keyboard_arrow_down";
	font-family:"Material Icons";
	position:absolute;
	right:5px;
	top:6px;
	font-size:15px;
}