pfs2.css

*:is(.journal-entry-content, .editor-content):has(.v-journal) {
	font-family: Lato, Raleway, Signika, sans-serif;
}

.v-journal {
	
	h1,
	h2,
	h3,
	h4 {
		font-variant: small-caps;
	}

	h4 {
		font-size: 1.2em;
		font-weight: bold;
	}

	>p {
		text-indent: 1em;
		
		a:is(.inline-check, .content-link) {
			padding-left: 1;
			text-indent: 0;
		}

		&:has(strong:only-of-type),
		&:has(strong:nth-child(1)):has(em:nth-last-child(1)) {

			text-indent: -2em;
			padding-left: 2em;

			strong:first-child {
				font-size: 0.95rem;
				margin-top: -0.2rem;
				margin-bottom: 0.2rem;
			}

			+p:not(:has(strong:only-of-type)) {
				padding-left: 2em;

				&:has(em:only-of-type) {
					text-indent: 1em;
					padding-left: 0;
				}

			}

		}

	}
	
	.vspq { max-height: 0.25rem; clear: both; margin: 0; }
	.vsph { max-height: 0.5rem; clear: both; margin: 0; }
	.vsp1 { max-height: 1rem; clear: both; margin: 0; }
	.vsp2 { max-height: 2rem; clear: both; margin: 0; }
	.vsp4 { max-height: 4rem; clear: both; margin: 0; }
	
	.message {
		font-family: Charm, "Indie Flower", "Bradley Hand" !important;
		font-size: 1.2rem !important;
	}

	blockquote {
		background: rgb(178, 170, 149, 0.2);
		border-left: 10px solid var(--alt);
		margin: 0.2em 0 0.5em 0;
		padding: 0.2em 10px 0.5em 10px;
	}

	.section {
		margin: 0.2em 0 0.5em 0;
		padding: 0.2em 10px 0.5em 10px;
		
		>p {
			
			&:empty:has(+ *):not(.vspq,.vsph,.vsp1,.vsp2,.vsp4),
			&:has(br:only-child):not(.vspq,.vsph,.vsp1,.vsp2,.vsp4) {
				display: none;
			}


			&:has(strong:only-child),
			&:has(strong:nth-child(1)):has(em:nth-last-child(1)) {
				
				strong:first-child {
					font-size: 0.95rem;
				}

			}

		}
		
		&:not(:is(.mini))>p {
			
			&:nth-child(1) {
				font-size: 1.15rem;
				font-variant: small-caps;
				font-weight: bold;
				margin-top: -0.2rem;
				margin-bottom: 0.2rem;
				float: left;
			}

			&:nth-child(2):not(:has(a),:is(.influence>p)) {
				font-size: 1.15rem;
				font-variant: small-caps;
				font-weight: bold;
				margin-top: -0.2rem;
				margin-bottom: 0.2rem;
				float: right;
			}				

		}
		
		>*:nth-child(3) {
			clear: both;
		}
		
		&.mini {
			background: rgb(233, 233, 233, 0.5);
			border-left: 10px solid #bbb;
			
			>p {
							
				&:has(strong:only-child),
				&:has(strong:nth-child(1)):has(em:nth-last-child(1)) {
				
					>strong:nth-child(1) {
						font-size: 1.05rem;
						font-variant: small-caps;	
					}

				}
			
			}
			
		}
		
		&.stat-block {
			background: rgb(0, 102, 68, 0.1);	
			border-left: 10px solid var(--color-text-dark-improved);

			+* {
				clear: both;
			}
		}
		
		&.influence {
			background: rgb(0, 102, 68, 0.1);	
			border-left: 10px solid var(--color-text-dark-improved);

			img.img-hug {
				margin-top: -2rem;
			}
			
			p:nth-child(2) {
				float: right;
				max-width: clamp( 3rem, 50%, max-content );

				&:has(a) {
					margin-left: 50%;
					margin-top: -0.2rem;
					font-variant: unset;
					font-size: 
				}
				
				&:not(:is(.encounter>p),:is(.stat-block>p)) {
					float: none;
					clear: left;
					font-style: italic;
				}
				
			}
		}

		&.encounter {
			&:not(.influence) {
				background: rgb(145, 1, 0, 0.1);
				border-left: 10px solid var(--color-pf-primary-lighter);
			}
			
			h3 {

				&:before {
					content: "Subtier ";
				}

				+p {
					float: right;
					position: relative;
					top: -2.3rem;
					font-size: 1.25rem;
					font-variant: small-caps;
				}
				
				&:is(.influence>h3) {
					border-color: var(--color-text-dark-improved);
				}

			}

			hr {
				border-top: 1px solid var(--color-pf-alternate-light);
				border-bottom: none;
				max-width: 85%;
				
				&:is(.influence>hr) {
					border-top: 1px solid var(--color-text-dark-improved);
				}
				
			}
			
			>.section.mini {

				background: rgb(233, 233, 233, 0.5);
				border-left: 10px solid #b99;

			}

		}

		&.rewards,
		&.reward {
			background: rgb(214, 180, 79, 0.1);
			border-left: 10px solid var(--color-pf-tertiary-darker);

			&:has(p:last-child > a) {
				padding-bottom: 2rem;
			}

			>p {
							
				&:nth-last-child(3) {

					&:has(> a) {
						float: left;

						&:not(:has(strong)):before {
							font-weight: bold;
							content: "Low Tier: "
						}
			
					}

				}
				
				&:nth-last-child(2) {

					&:has(> a):not(:has(strong)) {
						float: right;
						margin-right: 5rem;

						&:before {
							font-weight: bold;
							content: "High Tier: "
						}
				
					}
				
				}


				&:nth-child(3+n):not(:nth-last-child(-n+3)) {
					float: none;
					margin: 0;
				}
			
			}


			+* {
				clear: both;
			}

		}

		&.skill-check {
			background: rgb(84, 22, 110, 0.1);
			border-left: 10px solid var(--color-rarity-unique);

			>p {

				&:nth-child(4) {
					float: left;

					&:before {
						font-weight: bold;
						content: "Low Tier: ";
					}

				}

				&:nth-child(5) {
					float: right;
					margin-right: 5rem;

					&:before {
						font-weight: bold;
						content: "High Tier: ";
					}

				}
				
				&:nth-child(n+6):nth-child(-n+9):not(:is(a)) {
					padding-left: 2rem;
					text-indent: -2rem;
					
					>a {
						text-indent:0;	
					}
				}

				&:nth-child(6):not(:empty):before {
					color: green;
					font-weight: bold;
					font-size: 0.95rem;
					content: "Critical Success: ";
				}

				&:nth-child(7):not(:empty):before {
					color: blue;
					font-weight: bold;
					font-size: 0.95rem;
					content: "Success: ";
				}

				&:nth-child(8):not(:empty):before {
					color: darkgoldenrod;
					font-weight: bold;
					font-size: 0.95rem;
					content: "Failure: ";
				}

				&:nth-child(9):not(:empty):before {
					color: red;
					font-weight: bold;
					font-size: 0.95rem;
					content: "Critical Failure: ";
				}

			}

			>*:nth-child(n+3):nth-child(-n+4) {
				padding-left: 0;
				text-indent: 0;
			}

			>*:nth-child(n+6),
			+* {
				clear: left;
			}

		}

		&.development {
			background: rgb(23, 31, 105, 0.1);
			border-left: 10px solid var(--secondary);
		}


	}

	table.invisible {
		border-collapse: collapse;
		border: none;

		tr td {
			background-color: transparent;
		}

	}

	.letter {
		background-color: rgb(178, 170, 149, 0.4);
		font-size: 1.2rem;
		padding: 1rem;
		border: 4px solid #777365;
		border-left: none;
		border-right: none;

		&.script {
			font-family: Charm;
		}

		&.plain {
			font-family: Palatino;
		}
	}

	.letter-script {
		background-color: rgb(178, 170, 149, 0.4);
		font-family: Charm;
		font-size: 1.2rem;
		padding: 1rem;
		border: 4px solid #777365;
		border-left: none;
		border-right: none;
	}

	.letter-plain {
		background-color: rgb(178, 170, 149, 0.4);
		font-family: Palatino;
		font-size: 1.2rem;
		padding: 1rem;
		border: 4px solid #777365;
		border-left: none;
		border-right: none;
	}

	img.v-img {
		border: 0;
		height: 200px;
	}

	aside {
		width: 40%;
		padding-left: 0.5rem;
		margin-left: 0.5rem;
		float: right;
		box-shadow: inset 5px 0 5px -5px #29627e;
		font-style: italic;
		color: #29627e;

		>p {
			margin: 0.5rem;
		}

		h3 {
			margin-left: 0.5rem;
			color: #29627e;
			font-size: 1.25em;
			font-variant: small-caps;
			border-bottom: 1px solid #29627e;
			font-weight: bold;
		}
		
		+ .section {
			width: 60%;	
		}

	}

	.img-hug {

		img {
			float: right;
			border: 0;
			height: 200px;
			width: auto;
		}
		
	}
	
	img.img-hug.right,
	img.hug-right {
		float: right;
		border: 0;
		height: 200px;
		width: auto;	
	}
		
	img.img-hug.left,
	img.hug-left {
		float: left;
		border: 0;
		height: 200px;
		width: auto;	
	}
	
	.influence-grid {
		display: grid;
		grid-template-columns: 33% 1fr;
		grid-auto-rows: min-content;
		grid-auto-flow: row;
		grid-template-areas:
			"dischead dischead"
			"discovery discovery"
			"infhead infhead";
		
		div {
			// border: solid 1px red;	
			
			&:nth-child(1) {
				grid-area: dischead;
			}
			
			&:nth-child(2) {
				grid-area: discovery;
			}
			
			&:nth-child(3) {
				grid-area: infhead;
			}
			
		}
		
		.header {
			font-weight: bold;
			font-variant: small-caps;
			font-size: 1.2rem;	
		}

		.check-block {
			
			& > p:empty:not(.vspq,.vsph,.vsp1,.vsp2,.vsp4) {
				display: none;	
			}
			
			
			div[data-pf2-checkgroup] {
				margin-top: 0.25rem;
			}
			
			div[data-pf2-checkgroup],
			a.inline-check {
				span.label {
					display: inline-block;
					max-width: calc( 100% - 2.75rem);
					overflow-x: clip;
				}	
			}
		}
		
				
		.names {
			font-style: italic;

			> p {
				line-height: 1.2;

				&:has(br) {
					line-height: 1.2;
				}
			}
		}

	}	

	.check-grid {
		display: grid;
		grid-template-columns: repeat(3, max-content);
		grid-auto-columns: repeat(3, max-content);
		grid-auto-rows: max-content;
		grid-auto-flow: row;
		grid-template-areas:
			". header header"
			"names checks checks";
		column-gap: 10px;

		.header {
			font-weight: bold;
		}

		.name, .names {
			font-style: italic;
			
			> p {
				line-height: 2;
				
				&:has(br) {
					line-height: 1.25;
				}
			}
		}

		.check-block {
/*			margin: auto; */
			overflow: clip;
			width: 250px;
			
			div[data-pf2-checkgroup] {
				margin-top: 0.25rem;
			}
		}

	}	
		
	.nobr { 
		white-space: nowrap;
		text-indent: 0;
	}


}

/* -------EDITOR ONLY--------- */

.editor-content .v-journal {
	.section>p {

		/*		
		&:has(br:only-child) {
			display: none;
		}
*/
		&:has(br:only-child):not(:has(+ *)):before {
			color: gray;
			font-style: italic;
			font-variant: none;
		}

	}

	.skill-check {

		>p:nth-child(4),
		>p:nth-child(5) {
			float: none;
		}

		&:not(:has(:nth-child(6))) {
			padding-bottom: 5px;
		}

	}
	
	table.min-table {
		width: max-content;
		max-width: 100%;
		text-align: center;
	}

}

/* ------ DISPLAY ONLY ------ */

/* .journal-entry-content :not(:has(.v-journal)) {

	div[data-pf2-checkgroup] {
		
		display: inline-block;
		
		a.inline-check {
			word-break: none;
		}
		
	}

} */

.journal-entry-content .v-journal {

	div[data-pf2-checkgroup] {
		margin-bottom: -1rem;
	}
	
	&:not(:has(.helyx-content)) div[data-pf2-checkgroup]:not(:is(div.check-block div)) {
		margin-top: -1rem;
	}
	
}

.journal-entry-page .v-journal {
	p:has(+ div[data-pf2-checkgroup] ) {
		display: inline;
	}
	
	a.inline-roll {
		* {
			text-indent: 0;
		}
	}
	
	div[data-pf2-checkgroup]:not(:is(div.check-block div)) {
		display: inline;
		
		br {
			display: none;	
		}
		
		a:not(:last-child) {
			margin-right: 0.5em;
			
			&::after {
				color: black;
				position: relative;
				right: -0.6em;
			}
			
		}
		
		a:not(:last-of-type,:nth-last-of-type(2))::after {
			content: ",";
			
		}
		
		a:nth-last-of-type(2) {
			margin-right: 1.4em;
			
			i:last-of-type {
				margin-right: -0.9em;	
			}
			
			&::after {
				color: black;
				content: "or";
				right: -1.25em;
			
			}
		}
		
		&+p:empty {
			display: none;
		}
		
	}
}


/* ------ LEGACY ------ */

.v-journal .overlap {
	height: 300px;
	width: 600px;
}

.v-journal .overlap .bg {
	border: none;
	position: relative;
	z-index: 1;
	height: inherit;
}

.v-journal .overlap .fg {
	border: none;
	position: relative;
	z-index: 2;
	float: right;
	transform: translate(0, -70%);
	right: 5%;
	height: 125%;
}

/* .v-journal table.min-table :is(td, th) {

} */

.v-journal table thead {
	background: var(--primary);
}

.v-journal table :is(td, th) {
	padding: 0.2rem 1rem;
}

.v-journal .center-block {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 50%;
}


.v-journal .img-grid {
	display: grid;
	grid-template-columns: auto repeat(3, max-content);
	vertical-align: middle;
}

.v-journal .img-grid img {
	border: 0;
	height: 200px;
	margin: 0;
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%, 0);
}

.v-journal .img-grid .img-slice {
	margin: auto;
	overflow: hidden;
	width: 120px;
}

.v-journal .img-grid .img-slice img {
	object-fit: cover;
	object-position: 50% 0;
}

.v-journal .mini-check {
	margin: auto;
	overflow: hidden;
	width: 40px;
}

.v-journal .mini-check .icon {
	display: none;
}

.v-journal .mini-check .label {
	display: none;
}

.v-journal .hang p {
	padding-left: 2em;
	text-indent: -2em;
}

.v-journal *:is(.no-hang, .unhang) p {
	text-indent: 0;
}

.v-journal .no-hang div {
	margin-left: 2em;
}

.v-journal .hang a {
	padding-left: 1;
	text-indent: 0;
}

/*
.journal-entry-content .v-journal .check-grid .check-block {
	margin-top: -20px;
}
*/