/** plugin: Vertical Timelines #2.2 code **/
/* BEGIN Vertical Timelines by Salvatos */
/* Set vars */
.timeline {
	--svtlinecolor: hsl(var(--s));
	--svtbgc: hsl(var(--n));
	--svtbgt: hsl(var(--nc));
}
/* Container shorthand */
.kanka-entity-timeline:not(.kanka-tag-horizontaltimeline) .entity-main-block {
	container: svt / inline-size;
}
@container svt (width > 600px) {
	/* Position events */
	li[id|="timeline-element"] {
		width: 50%;
		padding-bottom: 25px;
	}
	li[id|="timeline-element"]:nth-child(2n+1) {
		left: 0;
		padding-right: 25px;
	}
	li[id|="timeline-element"]:nth-child(2n) {
		left: 50%;
		padding-left: 25px;
	}
	/* Shorten the bar on the last item so it doesn't collide with buttons */
	li[id|="timeline-element"]:last-child {
		padding-bottom: 0;
		margin-bottom: 15px;
	}
	/* Position markers*/
	li[id|="timeline-element"] > i {
		position: absolute;
		top: 7px;
		background-color: var(--svtbgc);
		color: var(--svtbgt);
	}
	li[id|="timeline-element"]:nth-child(2n) > i {
		left: calc(0% - 15px);
	}
	li[id|="timeline-element"]:nth-child(2n+1) > i {
		left: calc(100% - 15px);
	}
	/* Position lines */
	li[id|="timeline-element"]::before {
		display: block !important; /* important otherwise Kanka sets the last one to 'table' */
		width: 6px;
		border-radius: 0;
		background-color: var(--svtlinecolor);
	}
	li[id|="timeline-element"]:nth-child(2n)::before {
		left: calc(0% - 2px);
	}
	li[id|="timeline-element"]:nth-child(2n+1)::before {
		left: calc(100% - 2px);
	}
	/* Set radius of line start */
	:is(li[id|="timeline-element"]::after, li[id|="timeline-element"]:first-of-type::before) {
		border-top-left-radius: 5px !important;
		border-top-right-radius: 5px !important;
	}
	/* Fix length and set radius of line end */
	:is(li[id|="timeline-element"]::after, li[id|="timeline-element"]:last-of-type::before) {
		display: initial;
		height: calc(100% - 25px);
		border-bottom-left-radius: 5px !important;
		border-bottom-right-radius: 5px !important;
	}
	/* Reshape event blocks */
	.timeline-item {
		margin: 0;
	}
	/* Remove the misplaced box-shadow from Kanka */
	.timeline > li .timeline-item {
		box-shadow: unset;
	}
  	/* More consistent spacing around the toggle */
  	.element-toggle .icon-hide {
		padding-inline: 2px;
	}
	/* Set date markers */
	.bg-aqua + .timeline-item .text-neutral-content {--svtbgc:#00c0ef;--svtbgt:#fff}
	.bg-black + .timeline-item .text-neutral-content {--svtbgc:#111;--svtbgt:#fff}
	.bg-brown + .timeline-item .text-neutral-content {--svtbgc: #a35831;--svtbgt:#fff}
  	.bg-grey + .timeline-item .text-neutral-content {/* use defaults */}
	.bg-green + .timeline-item .text-neutral-content {--svtbgc:#00a65a;--svtbgt:#fff}
	.bg-light-blue + .timeline-item .text-neutral-content {--svtbgc:#3c8dbc;--svtbgt:#fff}
	.bg-maroon + .timeline-item .text-neutral-content {--svtbgc:#d81b60;--svtbgt:#fff}
	.bg-navy + .timeline-item .text-neutral-content {--svtbgc:#001f3f;--svtbgt:#fff}
	.bg-orange + .timeline-item  .text-neutral-content {--svtbgc:#ff851b;--svtbgt:#fff}
	.bg-pink + .timeline-item .text-neutral-content {--svtbgc:#ebbde9;--svtbgt:#fff}
	.bg-purple + .timeline-item .text-neutral-content {--svtbgc:#605ca8;--svtbgt:#fff}
	.bg-red + .timeline-item .text-neutral-content {--svtbgc:#dd4b39;--svtbgt:#fff}
	.bg-teal + .timeline-item .text-neutral-content {--svtbgc:#39cccc;--svtbgt:#111}
	.bg-yellow + .timeline-item .text-neutral-content {--svtbgc:#f39c12;--svtbgt:#fff}
	.timeline-item-head .text-neutral-content {
		position: absolute;
		top: 7px;
		width: max-content;
		padding: 5px 8px;
		border: 1px solid var(--svtbgc);
		border-radius: 3px;
		box-shadow: 0 1px 1px rgba(0,0,0,.1);
		background-color: var(--svtbgc);
		color: var(--svtbgt);
      	overflow: visible;
	}
	li[id|="timeline-element"]:nth-child(2n) .text-neutral-content {
		right: calc(100% + 75px);
	}
	li[id|="timeline-element"]:nth-child(2n+1) .text-neutral-content {
		left: calc(100% + 75px);
	}
	/* Fancy arrowheads */
	li[id|="timeline-element"]:nth-child(2n) .text-neutral-content:after,
	li[id|="timeline-element"]:nth-child(2n+1) .text-neutral-content:before {
		content: "";
		display: block;
		position: absolute;
		top: 1px;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-radius: 50%;
	}
	li[id|="timeline-element"]:nth-child(2n) .text-neutral-content:after {
		right: -25px;
		border-right: none;
		border-left: 25px solid var(--svtbgc);
	}
	li[id|="timeline-element"]:nth-child(2n+1) .text-neutral-content:before {
		left: -25px;
		border-left: none;
		border-right: 25px solid var(--svtbgc);
	}
}
/* END Vertical Timelines by Salvatos */

/** plugin: Scrollable Main Sidebar #1.13 code **/
/* BEGIN Scrollable Main Sidebar */
.main-sidebar {
  --sidebar-scrollbar-track-color: auto;
  --sidebar-scrollbar-slider-color: auto;
  --sidebar-scrollbar-width: thin;
}
@media (min-width:768px) {
	.main-sidebar {
		position: fixed;
	}
	.main-sidebar .sidebar-menu {
		margin-bottom: 3rem;
	}
	/* Main site sidebar */
	body:not(#map-body) .main-sidebar .sidebar {
		height: calc(100vh - (160px + 50px) - 3rem) !important;
		padding-bottom: 1em;
		overflow-y: scroll;
		scrollbar-width: var(--sidebar-scrollbar-width);
		scrollbar-color: var(--sidebar-scrollbar-slider-color) var(--sidebar-scrollbar-track-color);
	}

	/* Webkit patch */
	body:not(#map-body) .main-sidebar .sidebar::-webkit-scrollbar {
		background-color: var(--sidebar-scrollbar-track-color);
	}
	body:not(#map-body) .main-sidebar .sidebar::-webkit-scrollbar-thumb {
		background-color: var(--sidebar-scrollbar-slider-color);
	}
}
/* END Scrollable Main Sidebar */

/** plugin: Map Sidebar Optimization #5 code **/
/* BEGIN Map Sidebar Optimization by Salvatos */
#map-body {
	--map-sidebar-text-align: justify;
	--map-sidebar-hyphenate: manual;
	--map-sidebar-font-size: 15px; /* Ideal for Source Sans Pro */
	--map-sidebar-scrollbar-track-color: auto;
	--map-sidebar-scrollbar-slider-color: auto;
	--map-sidebar-scrollbar-width: thin;

	/* Legend spacing */
	#sidebar-map {
		.marker-actions {
			padding-block: 1em;
		}
		.map-legend:not(:last-child) {
			padding: 0 10px;
		}
	}
	/* Get rid of empty space between title and Edit button 
		when the map has no entry */
	.marker-header + .marker-entry:not(:has(p, li, img, div, table)) {
		display: none;
	}

	/* Sticky Back/Remove button */
	.map-legend:last-child,
	.marker-header ~ div .marker-actions {
		position: sticky;
		bottom: 0px;
		margin: 0;
		padding: 10px 0px;
		background: var(--sidebar-background, hsl(var(--si)));
		border-top-left-radius: unset;
    	border-top-right-radius: unset;
	}
	.marker-header + .gap-3 {
		gap: unset;
	}
	.marker-tags {
		margin-bottom: .5rem;
	}

	/* Marker text alignment */
	:is(.sidebar, #map-marker-modal) .entity-content :is(p, li) {
		text-align: var(--map-sidebar-text-align);
		hyphens: var(--map-sidebar-hyphenate);
		font-size: var(--map-sidebar-font-size);
	}

	/* Separate marker text and entity entry with a horizontal line
	rather than the default "From entity" header */
	.marker-custom-entry {
		padding-bottom: 10px;
	}
	.marker-custom-entry ~ .marker-entity-entry {
		border-top: 2px solid #eee;
		padding-top: 10px;
	}
	/* mobile modal */ 
	.marker-entry ~ .marker-entry {
		border-top: 1px solid #bbb;
		padding-top: 10px;
	}
	.marker-custom-entry + .marker-entity-entry {
		display: none;
	}

	/* Scrollbar width and colors */
	:is(#sidebar-content, #map-marker-modal article) {
		scrollbar-width: var(--map-sidebar-scrollbar-width);
		scrollbar-color: var(--map-sidebar-scrollbar-slider-color) var(--map-sidebar-scrollbar-track-color);
	}
	/* Webkit patch */
	:is(#sidebar-content, #map-marker-modal article)::-webkit-scrollbar {
		background-color: var(--map-sidebar-scrollbar-track-color);
	}
	:is(#sidebar-content, #map-marker-modal article)::-webkit-scrollbar-thumb {
		background-color: var(--map-sidebar-scrollbar-slider-color);
	}

	/* Prevent scrollbar in main pane */
	@media (min-width:768px) {
		#sidebar-map, .main-sidebar {
			max-height: calc(100vh - 3.1rem);
		}
	}
}
/* END Map Sidebar Optimization by Salvatos */

/** plugin: Mention Type Indicators #3.4 code **/
/* BEGIN Mention Type Indicators by Salvatos */
.entity-mention::after {
	font-size: var(--mention-icon-size, 12px);
	font-family: "Font Awesome 6 Pro";
	font-weight: 900;
}
.entity-mention[data-entity-type="ability"]::after   { content: " \f06d" }
.entity-mention[data-entity-type="calendar"]::after  { content: " \f133" }
.entity-mention[data-entity-type="character"]::after { content: " \f007" }
.entity-mention[data-entity-type="creature"]::after  { content: " \f78e" }
.entity-mention[data-entity-type="event"]::after     { content: " \f1fd" }
.entity-mention[data-entity-type="family"]::after    { content: " \e300" }
.entity-mention[data-entity-type="journal"]::after   { content: " \f5db" }
.entity-mention[data-entity-type="location"]::after  { content: " \f602" }
.entity-mention[data-entity-type="map"]::after 		 { content: " \f279" }
.entity-mention[data-entity-type="note"]::after 	 { content: " \f518" }
.entity-mention[data-entity-type="item"]::after 	 { content: " \f3a5" }
.entity-mention[data-entity-type="organisation"]::after { content: " \f63d" }
.entity-mention[data-entity-type="quest"]::after 	 { content: " \f4d9" }
.entity-mention[data-entity-type="race"]::after 	 { content: " \e608" }
.entity-mention[data-entity-type="tag"]::after 		 { content: " \f02c" }
.entity-mention[data-entity-type="timeline"]::after  { content: " \e1d1" }
/* END Mention Type Indicators by Salvatos */

/** plugin: External Link Icon and Styling #1.6 code **/
/* BEGIN External Link Icon and Styling by Salvatos */
:root {
	--external-link-color: var(--link-text);
	--external-link-hover-color: var(--link-hover);
	--external-link-font: inherit;
	--external-link-size: inherit;
	--external-link-weight: inherit;
	--external-link-decoration: inherit;
    --intercampaign-link-color: var(--link-text);
	--intercampaign-link-hover-color: var(--link-hover);
}
:is(.entity-content, .note-editable) {
  a[href*="//"]:not([href*="kanka.io"]) {
	color: var(--external-link-color, hsl(var(--p)));
	font-family: var(--external-link-font);
	font-size: var(--external-link-size);
	font-weight: var(--external-link-weight);
	text-decoration: var(--external-link-decoration);
  }
  a[href*="//"]:not([href*="kanka.io"]):hover {
    color: var(--external-link-hover-color, hsl(var(--pf)));
  }
  a[href*="//"]:not([href*="kanka.io"])::after {
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    content: "\f35d";
    font-size: 9px;
    vertical-align: top;
    margin-left: 2px;
  }
}
/* Inter-campaign mentions (in imported entities) */
.external-mention {
    color: var(--intercampaign-link-color, hsl(var(--p)));
	font-family: var(--external-link-font);
	font-size: var(--external-link-size);
	font-weight: var(--external-link-weight);
	text-decoration: var(--external-link-decoration);
}
.external-mention:hover {
    color: var(--intercampaign-link-hover-color, hsl(var(--pf)));
}
.external-mention::after {
    font-family: "Font Awesome 6 Pro";
	font-weight: 900;
	content: "\f127";
	font-size: 10px;
	margin-left: 3px;
}
/* END External Link Icon and Styling by Salvatos */

/** plugin: Keep Map Layers Visible #1 code **/
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: block;
	position: relative;
}
.leaflet-control-layers .leaflet-control-layers-toggle,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
}
.leaflet-control-layers {
	padding: 6px 10px 6px 6px;
	color: #333;
	background: #fff;
}

/** plugin: Pinned Entity Image #0.4 code **/
/* BEGIN Pinned Entity Image */
/* Preset width and heights */
.pinned-attribute[data-attribute^="pinned portrait"] {
  	--pinned-portrait-width: 170px; /* Kanka default sidebar width */
  	--pinned-portrait-height: var(--pinned-portrait-width); /* Default to square images like the entity header */
}
.pinned-attribute[data-attribute^="pinned portrait 200"] {
  	--pinned-portrait-height: 200px;
}
.pinned-attribute[data-attribute^="pinned portrait 250"] {
  	--pinned-portrait-height: 250px;
}
.pinned-attribute[data-attribute^="pinned portrait 300"] {
  	--pinned-portrait-height: 300px;
}
.pinned-attribute[data-attribute^="pinned portrait 350"] {
  	--pinned-portrait-height: 350px;
}
.pinned-attribute[data-attribute^="pinned portrait 400"] {
  	--pinned-portrait-height: 400px;
}
.pinned-attribute[data-attribute^="pinned portrait 450"] {
  	--pinned-portrait-height: 450px;
}
.pinned-attribute[data-attribute^="pinned portrait 500"] {
  	--pinned-portrait-height: 500px;
}
/* Set background, dimensions and styles */
.pinned-attribute[data-attribute^="pinned portrait"] {
	padding: 0;
  	display: block; /* To force display on campaigns that hide attributes with empty values */
    border: unset;
}
.pinned-attribute[data-attribute^="pinned portrait"]:not([data-attribute*="caption"])::after,
.pinned-attribute[data-attribute^="pinned portrait"][data-attribute*="caption"]::before {
  	display: block;
	content: "";
    background-image: var(--entity-image-url, url("https://images.unsplash.com/photo-1528731708534-816fe59f90cb?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=300&q=80"));
    margin-left: calc(-1 * var(--sidebar-section-padding));
    width: var(--pinned-portrait-width);
    height: var(--pinned-portrait-height);
    background-size: var(--pinned-portrait-width) var(--pinned-portrait-height);
}
/* Hide the attribute’s name */
.pinned-attribute[data-attribute^="pinned portrait"] > strong {
    display: none;
}
/* Style the attribute’s value as a subheading */
.pinned-attribute[data-attribute^="pinned portrait"]:not([data-attribute*="caption"]) > .pull-right {
    display: block;
	float: unset !important;
	text-align: center;
	font-weight: bold;
}
/* Style the attribute’s value as a caption */
.pinned-attribute[data-attribute^="pinned portrait"][data-attribute*="caption"] > .pull-right {
    display: block;
	float: unset !important;
	text-align: center;
	font-style: italic;
}
/* Hide the gap after the attribute’s value */
.pinned-attribute[data-attribute^="pinned portrait"] > .pull-right + .clear {
    display: none;
}
/* Hide the bottom border */
.pinned-attribute[data-attribute^="pinned portrait"] + .pinned-attribute {
    border: unset;
}

/* Force pinned portrait to go above pinned relations */
/* Only applies when the pinned portrait is the first pinned attribute */
#sidebar-pinned-elements .pins {
	display: flex;
	flex-direction: column;
}
.pinned-relation + .pinned-attribute[data-attribute^="pinned portrait"] {
	order: -1;
}
/* Hide attribute from search pane entity preview */
.search-preview .entity-pinned-attributes [data-attribute^="pinned portrait"] {
	display: none;
}
/* END Pinned Entity Image */

/** plugin: Better Grid View - Dead Characters #1.1 code **/
div[data-dead="true"]{
    border-color: #484848;
    border-width: .35em;
 }

.entity.block[data-dead="true"] a{
  filter: grayscale(100%);
 }

/** plugin: Change Hidden post color #1.2 code **/
:root {
  --mj-bg-color: #b9e3fb;
}

body[data-theme="dark"] {
  --mj-bg-color: #42484e;
}

body[data-theme="midnight"] {
  --mj-bg-color: #092d44;
}

[data-visibility="2"] .post {
  background-color: var(--mj-bg-color);
}

.character-personalities:has(.fa-lock) .bg-box {
    background-color: var(--mj-bg-color);
}

/** plugin: Pin Privacy Icons #2 code **/
/* BEGIN Pinned Attribute Privacy Icons By Salvatos */
:is(.pinned-attribute, .pinned-relation) > strong::after {
	font-family: "Font Awesome 6 Pro";
	font-size: 10px;
	color: hsl(var(--bc) / .5);
}
/* Non-admins will never see anything but public attributes,
   so there’s no use showing them any icon for attributes */
.is-admin .pinned-attribute > strong::after {
	content: var(--public-attribute-icon, " \f3c1");
}
.is-admin .pinned-attribute[data-private="true"] > strong::after {
	content: var(--public-attribute-icon, " \f023");
}
/* Connections matter for everyone */
/* All: unlocked */
.pinned-relation[data-visibility="1"] > strong::after {
	content: var(--public-attribute-icon, " \f3c1");
}
/* Admins: locked */
.pinned-relation[data-visibility="2"] > strong::after {
	content: var(--private-attribute-icon, " \f023");
}
/* Me & Admins: person-lock */
.pinned-relation[data-visibility="3"] > strong::after {
	content: var(--self-admins-connection-icon, "\f502");
}
/* Only Me: spy */
.pinned-relation[data-visibility="4"] > strong::after {
	content: var(--self-only-connection-icon, "\f21b");
}
/* Campaign members: group */
.pinned-relation[data-visibility="5"] > strong::after {
	content: var(--members-only-connection-icon, "\f0c0");
}
/* END Pinned Attribute Privacy Icons By Salvatos */

/** plugin: Back to top #1.0 code **/
.content-wrapper {
  position: relative;
  padding-bottom: 50px;
}

.back-to-top {
  display: block !important;
}

/** plugin: Notice Posts #2.0 code **/
/* BEGIN Notice Posts by Salvatos */
/* Hide unwanted elements */
.notice-post :is(.post-header h3, span[id|="visibility-icon"], .element-toggle i, .post-details, .post-footer) {
	display: none;
}
/* Keep box-tools for admins but take them out of the stacking context to keep the box lean */
.notice-post .post-header .dropdown {
	position: absolute;
	top: -3px;
	right: 0;
}
.notice-post .post-header .dropdown > a {
	vertical-align: unset;
	padding: 0 3px 0 0;
}
/* Center paragraphs/blocks vertically */
.notice-post .entity-content *:last-child {
	margin-bottom: 0;
}
/* Center text by default */
.notice-post .post-body {
	text-align: center;
}
/* Set up easy background changes via bg-* classes and style main container */
.notice-post {
	position: relative;
  	background: var(--box-background);
  	border-radius: .25rem;
    gap: 0;
}
.notice-post .bg-box {
	background-color: inherit;
}
/* END Notice Posts by Salvatos */

/** plugin: Center marker on maps #Copy of 0.4 code **/
/*  CENTER MARKER ON MAPS  */
/* except for polygon editor */
.leaflet-marker-icon.marker:not(.leaflet-vertex-icon) {
  margin-left: 0px !important;
  margin-top: 0px !important;
  width: 0px !important;
  height: 0px !important;
}

/* MAKE MARKER PINS CIRCLE */
.marker-pin {
  border-radius: 50% 50% 50% 50%;
}

/* REMOVE MARKER PINS FOR TRANSPARENT BACKGROUNDS */
.marker-pin[style="background-color: unset"] {
  box-shadow: none;
}