@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100..900&display=swap');

:root[data-theme="light"] {
	--containercolor: #B3BCCC;
  --footercolor: #2b3c5e;
  --backgroundimage: url('https://file.garden/ZYYq69YewxMFnAFy/pastrydiy/forestbackgroundblue.jpg');
  --headertext: #2b3c5e;
  --footertext: #B3BCCC;
  --iconfilter: invert(21%) sepia(26%) saturate(1090%) hue-rotate(181deg) brightness(93%) contrast(90%);
  --folderfilter: invert(91%) sepia(3%) saturate(1753%) hue-rotate(187deg) brightness(83%) contrast(92%);
  --foldertext: black;
  --shadow: #0f1929;
  --body: #768eb0;
}

:root[data-theme="dark"] {
	--containercolor: #fbf4e2;
  --footercolor: #784d54;
  --backgroundimage: url('https://file.garden/ZYYq69YewxMFnAFy/pastrydiy/forestbackground.jpg');
  --headertext: #784d54;
  --footertext: #fbf4e2;
  --iconfilter: invert(31%) sepia(33%) saturate(552%) hue-rotate(301deg) brightness(92%) contrast(82%);
  --folderfilter: invert(20%) sepia(10%) saturate(2377%) hue-rotate(301deg) brightness(91%) contrast(91%);
  --foldertext: black;
  --shadow: #673C43;
  --body: #532D33;
}
/* hey i see you. remove this credit to spectrediy or spectre and I shred you */
.SPECTRE {
  width: 450px;
  height: 300px;
  background-color: var(--containercolor);
  display: block;
  margin: auto;
  border-radius: 2px;
}

.header {
	height: 25px;
  padding: 2.5px 7px;
  display: flex;
}

.pfp {
	height: 20px;
  width: 20px;
  border: 2px solid var(--headertext);
  border-radius: 10px;
}

.battery {
  height: 20px;
  width: 20px;
 background-image: url('https://file.garden/ZYYq69YewxMFnAFy/pastrydiy/battery.png'); 
  background-size: contain;
  margin-left: 185px;
  filter: var(--iconfilter);
}

.date {
	margin-left: 10px;
}

.date p {
	color: var(--headertext);
}

.menu {
	background-image: url('https://file.garden/ZYYq69YewxMFnAFy/pastrydiy/hamburger.png');
  background-size: contain;
  height: 15px;
  width: 15px;
  margin-top: 3px;
  margin-left: 10px;
  filter: var(--iconfilter);
}

.body {
  height: 250px;
	background-image: var(--backgroundimage);
  background-size: 455px;
  background-repeat: no-repeat;
  background-position: center;
  padding: 25px 10px;
}

.footer {
  background-color: var(--footercolor);
  height: 25px;
}

.container-base {
  background: transparent;
  padding: 0px;
}

.container-base p {
  font-family: "Lexend Deca";
  font-size: 17px;
}

.paste-container {
  width: 460px;
  padding: 0px;
}

.site-header p, .site-header .dropdown {
  display: none;
}

p {
  margin-top: -2.5px !important;
}

.folder {
  margin-top: -15px;
  margin-left: 10px;
  width: 60px;
  filter: var(--folderfilter);
}

.folder p {
  color: var(--foldertext);
  position: relative;
  top: -7px;
  width: inherit;
}

.window {
	background-color: var(--containercolor);
  width: 300px;
  height: 225px;
  margin-top: -253px;
  margin-left: 110px;
  box-shadow: 0px 0px 18px -3px var(--shadow);
	-webkit-box-shadow: 0px 0px 18px -3px var(--shadow);
	-moz-box-shadow: 0px 0px 18px -3px var(--shadow);
}

.windowheader {
	height: 22px;
  background-color: var(--footercolor);
  padding: 0px 10px;
}

.windowheader p {
	text-align: right;
  color: var(--footertext)
}

.scroll {
  width: 280px;
  height: 183px;
  margin-left: 10px;
  margin-top: 10px;
  display: block;
  overflow: auto;
}

.scroll p {
	color: var(--headertext);
}

::-webkit-scrollbar {
  width: 0px;
}

.alt-page:target {
  display: block;
}

.alt-page:not(:target) {
	display: none;
}

body {
 background-color: var(--body) 
}

.edit {
  background-color: var(--containercolor);
  color: var(--body)
}

.edit:hover {
  background-color: var(--body);
  color: var(--containercolor);
}

.site-footer, .publish-timestamp, .edit-timestamp {
	display: none;
}

.owner-info, .views-count, .owner-info a {
	color: var(--containercolor);
}