
:root{
	--fontbody:'ralewayregular',sans-serif;
	--fontblack:'ralewayblack',sans-serif;
	--fontsemibold:'ralewaysemibold',sans-serif;
	--fontbold:'ralewayblack',sans-serif;
	--color1:#000;
	--color2:#fff;
	--color3:#009688;
	--color4:#262b33;
}


*, *:after, *:before{box-sizing:border-box;}
html{scroll-behavior:smooth; -moz-osx-font-smoothing:grayscale; -webkit-font-smoothing:antialiased; font-smoothing:antialiased; height:auto; min-height:100%; background:var(--color1); color:var(--color2);}
body{margin:0; padding:0; font-size:17px; line-height:25px; font-family:var(--fontbody); font-weight:100!important; background:var(--color1); color:var(--color2);}

h1, h2, h3, h4, h5, h6{margin:0;}
h1, h2, h3{font-family:var(--fontblack);}
h1{font-size:38px; line-height:44px; padding:0 0 16px;}
h2{font-size:28px; line-height:34px; padding:0 0 18px; color:var(--color3);}
h3{font-size:22px; line-height:28px; padding:0 0 10px;}
h4{font-family:var(--fontsemibold); font-size:18px; line-height:24px;}
	
p{margin:0; padding:0 0 16px;}
a{color:var(--color2); text-decoration:none; outline:0; transition:.2s;}
a:hover{color:var(--color3); text-decoration:none; outline:0;}
b, strong{font-family:var(--fontsemibold); font-weight:100;}
img{height:auto; max-width:100%; vertical-align:middle;}
ul{margin:0; padding:0;}
code{font-family:monospace; font-size:14px; line-height:1.4;}

.wrapper{min-height:100vh; display:flex; flex-direction:column;}
.main{background:var(--color1); background-image:linear-gradient(to bottom, var(--color1), var(--color4)); padding:10px 0 60px; flex:1;}
.row{max-width:1380px; margin:0 auto; padding:0 40px;}

.header{position:relative; width:100%; background:transparent; height:auto;}
.header-row{display:flex; align-items:flex-start; justify-content:space-between; position:relative;}

.logo{position:relative; z-index:88; padding:24px 0 16px;}
.logo img{max-width:210px;}
.logo a{display:inline-block;}

.docs-toggle{display:none; width:48px; height:48px; margin-top:22px; border:0; background:rgba(255,255,255,.08); border-radius:10px; padding:0; cursor:pointer;}
.docs-toggle span{display:block; width:22px; height:2px; background:var(--color2); margin:5px auto; transition:.2s;}
.docs-layout{display:grid; grid-template-columns:300px minmax(0,1fr); gap:40px; align-items:start;}
.docs-sidebar{position:relative;}
.docs-sidebar-inner{position:sticky; top:20px; background:rgba(255,255,255,.04); border-radius:18px; padding:22px; box-shadow:0 10px 30px rgba(0,0,0,.15);}
.docs-title{font-family:var(--fontblack); font-size:20px; line-height:24px; padding:0 0 18px; color:var(--color3);}
.docs-nav ul{display:flex; flex-direction:column; gap:2px; list-style:none;}
.docs-nav li{position:relative;}
.docs-nav li a{display:block; padding:5px 0 5px 12px; font-size:16px; line-height:20px; color:rgba(255,255,255,.75); background:transparent; border-radius:0; position:relative;}
.docs-nav li a:hover{color:var(--color3);}
.docs-nav li::before{content:''; position:absolute; left:0; top:8px; bottom:8px; width:3px; background:rgba(255,255,255,.12);}
.docs-nav li.current a{color:var(--color2); font-family:var(--fontsemibold);}
.docs-nav li.current::before{background:var(--color3); width:3px;}
.docs-content{min-width:0;}
.doc-entry{display:flex; flex-direction:column; gap:26px;}
.doc-intro{background:rgba(255,255,255,.04); border-radius:22px; padding:28px; box-shadow:0 10px 30px rgba(0,0,0,.12); position:relative; padding-right:150px;}
.doc-intro .label{position:absolute; top:28px; right:28px; margin:0; white-space:nowrap;}
.doc-intro h1{padding-top:0; margin:0;}
.doc-block{background:rgba(255,255,255,.04); border-radius:22px; padding:28px; box-shadow:0 10px 30px rgba(0,0,0,.12);}
.label{display:inline-block; background:rgba(0,150,136,.1); color:var(--color3); padding:7px 12px; border-radius:999px; font-size:13px; line-height:18px; font-family:var(--fontsemibold); margin:0 0 18px;}
.doc-intro p, .doc-block p{color:rgba(255,255,255,.82);}
.code-wrap{border-radius:18px; overflow:hidden; background:#0f1115;}
.code-head{display:flex; justify-content:space-between; align-items:center; padding:14px 18px; background:rgba(255,255,255,.04); gap:15px;}
.code-head span{font-family:var(--fontsemibold); font-size:14px; line-height:18px; color:rgba(255,255,255,.8);}
.copy-btn{appearance:none; border:0; background:rgba(0,150,136,.18); color:var(--color2); padding:9px 14px; border-radius:10px; cursor:pointer; font-family:var(--fontsemibold); font-size:14px; line-height:16px; transition:.2s;}
.copy-btn:hover{background:rgba(0,150,136,.32); transform:translateY(-1px);}
pre{margin:0; padding:22px; overflow:auto; background:#0f1115;}
.code-block{display:block; white-space:pre; min-width:max-content; color:#e7edf3;}
.table-wrap{overflow:auto; border-radius:16px;}
.doc-table{width:100%; border-collapse:collapse; min-width:680px; background:rgba(255,255,255,.02);}
.doc-table thead th{font-family:var(--fontsemibold); text-align:left; padding:14px 16px; background:rgba(255,255,255,.05); color:var(--color2); font-weight:100;}
.doc-table tbody td{padding:14px 16px; border-top:1px solid rgba(255,255,255,.08); vertical-align:top; color:rgba(255,255,255,.84);}
.doc-table code{background:rgba(255,255,255,.06); padding:4px 8px; border-radius:8px; font-size:13px;}
.copy-btn.copied{background:transparent; color:var(--color5); padding:9px 12px;}
.copy-btn.copied i{font-size:18px; line-height:1; display:block;}

.footer{background:var(--color3); color:var(--color2); padding:24px 0; font-weight:500;}
.footer a{color:var(--color2);}
.footer a:hover{color:var(--color2); text-decoration:underline;}
.footer-row{display:flex; justify-content:space-between; align-items:center; gap:20px;}
.footer p{padding:0; margin:0;}
.footer-left{display:flex; gap:18px; flex-wrap:wrap;}

@media(max-width:1100px){
	.docs-layout{grid-template-columns:1fr; gap:24px;} 
	.docs-toggle{display:block;} 
	.docs-sidebar{display:none;} 
	.docs-sidebar.is-open{display:block;} 
	.docs-sidebar-inner{position:relative; top:0; margin-top:8px;}
}

@media(max-width:680px){
	body{font-size:16px; line-height:24px;} 
	
	h1{font-size:27px; line-height:32px; padding-bottom:12px;} 
	h2{font-size:21px; line-height:26px; padding-bottom:14px;} 
	h3{font-size:19px; line-height:24px; padding-bottom:8px;} 
	h4{font-size:17px; line-height:23px;} 
	p{padding-bottom:14px;} 
	pre{padding:16px;}
	
	.row{padding:0 20px;} 
	
	.main{padding:16px 0 32px;} 
	
	.logo{padding-top:20px; padding-bottom:6px;} 
	.logo img{max-width:170px;} 
	
	.docs-title{font-size:18px; line-height:22px; padding-bottom:14px;} 
	.docs-nav li a{padding:9px 12px; font-size:15px; line-height:21px;} 
	.doc-entry{gap:18px;} 
	.doc-intro, .doc-block{padding:18px; border-radius:18px;} 


	.doc-intro .label{
		position:static;
		display:inline-block;
		margin:0 0 12px;
		white-space:normal;
	}
	
	.doc-table thead th, 
	.doc-table tbody td{padding:12px 14px; font-size:14px; line-height:20px;} 
	.docs-toggle{width:40px; height:40px; margin-top:20px; background:transparent; border-radius:0;} 
	.docs-toggle span{width:32px; height:4px; margin:6px auto;}
	.label{font-size:12px; line-height:16px; padding:6px 10px; margin-bottom:14px;} 
	.code-head{padding:12px 14px;} 
	.code-head span{font-size:13px; line-height:17px;} 
	.copy-btn{padding:8px 12px; font-size:13px; line-height:15px;} pre{padding:14px;} 
	.code-block, code{font-size:13px; line-height:1.5;} 
	
	.footer{padding:20px 0;} 
	.footer-row{flex-direction:column; gap:10px;} 
	.footer-right{gap:14px;} 
	
}


@font-face{
	font-family:'ralewayblack';
	src:url('/theme/css/raleway-black-webfont.eot');
	src:url('/theme/css/raleway-black-webfont.eot?#iefix') format('embedded-opentype'),
		url('/theme/css/raleway-black-webfont.woff2') format('woff2'),
		url('/theme/css/raleway-black-webfont.woff') format('woff'),
		url('/theme/css/raleway-black-webfont.ttf') format('truetype'),
		url('/theme/css/raleway-black-webfont.svg#ralewayblack') format('svg');
	font-weight:normal;
	font-style:normal;
	font-display:swap;
}

@font-face{
	font-family:'ralewayregular';
	src:url('/theme/css/raleway-regular-webfont.eot');
	src:url('/theme/css/raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),
		url('/theme/css/raleway-regular-webfont.woff2') format('woff2'),
		url('/theme/css/raleway-regular-webfont.woff') format('woff'),
		url('/theme/css/raleway-regular-webfont.ttf') format('truetype'),
		url('/theme/css/raleway-regular-webfont.svg#ralewayregular') format('svg');
	font-weight:normal;
	font-style:normal;
	font-display:swap;
}
@font-face{
	font-family:'ralewaysemibold';
	src:url('/theme/css/raleway-semibold-webfont.eot');
	src:url('/theme/css/raleway-semibold-webfont.eot?#iefix') format('embedded-opentype'),
		url('/theme/css/raleway-semibold-webfont.woff2') format('woff2'),
		url('/theme/css/raleway-semibold-webfont.woff') format('woff'),
		url('/theme/css/raleway-semibold-webfont.ttf') format('truetype'),
		url('/theme/css/raleway-semibold-webfont.svg#ralewaysemibold') format('svg');
	font-weight:normal;
	font-style:normal;
	font-display:swap;
}

