/*--- Single Blog Post -----*/
.page-header , .post-header {
	position:relative;
	margin-bottom:4px;
}

.single-post .featured-image {}

.with-image .entry-title {  }

.header-content {   }

.with-image .header-content {}

.entry-content { display:flow-root; }

.post-categories {margin-block:56px; font-size:0.9em;}

/*---- Social Share buttons ----*/
.single-post .sidebarAndContent {
	grid-template-columns: 1fr min( 90vw , var(--maxwidth) ) 1fr;
}

.single-post .sidebarAndContent .entry-content {padding:0 16px;}

.socialShareBtns {
	display:grid;
	align-content: start;
	justify-content:end;
}
.socialShareBtns .wrapper {
	display:grid;
	position:sticky;
	top:calc( var(--headerOffset) - 6px );
	gap:4px;
	padding:12px 0;
}
.socialShareBtns img {vertical-align:top;}

@media (max-width:600px) {
	.socialShareBtns .wrapper {
		grid-auto-flow:column;
		justify-content:start;
		align-items:center;
	}
}

/*-------------- Related Blog Posts -----------------*/

.related-posts {
	display:grid;
	grid-auto-rows:minmax(140px, auto);
	grid-template-columns: repeat(3, 1fr);
	gap:8px;
}
.related-posts .post-summary-box {
	margin:0;
}
.related-posts article.has-post-thumbnail {
	grid-template-columns: 3fr 4fr;
}
.related-posts .summary-content {
	padding:8px;
	grid-column:2/3;
	grid-row:1;
}
.related-posts .post-summary-box :is(p, .postType) {
	display:none;
}
.related-posts .featured-img-link {
	grid-column:1/2;
	grid-row:1;
}
.related-posts .post-summary-box .entry-title {
	font-size:1.2em;
}

.related-posts .post-summary-box:first-child {
	grid-row:1/3;
}
.related-posts .post-summary-box:first-child  .featured-img-link {
	grid-column:1/-1;
	grid-row:1/3;
}
.related-posts .post-summary-box:first-child  .summary-content {
	z-index:3;
	grid-column:1/-1;
	grid-row:2/3;
	color:white;
	background:linear-gradient(#0000,#0009 50%);
	place-content:end;
}
.related-posts .post-summary-box:first-child .entry-title {
	font-size:1.5em;
}
.related-posts .post-summary-box:first-child  .summary-content a {
	color:inherit;
}
@media(max-width:1100px){
	.related-posts {grid-template-columns:1fr 1fr; }	
}
@media(max-width:520px){
	.related-posts {grid-template-columns:1fr;}	
}



/*---- Previous and Next Post ------*/
.post-navigation {
    display: flex;
    justify-content: space-between;
    margin-block: 32px;
    gap: 12px;
}
.nav-link {
	flex:1 1 280px;
	display: flex;
	text-decoration: none;
	border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    background-color: #fff;
    transition: box-shadow 0.3s ease;
}
.nav-link:hover {    box-shadow: 0 0 10px rgba(0,0,0,0.1);}

.nav-link.next {flex-direction: row;}
.nav-link.prev {
    flex-direction: row-reverse;
    text-align: right;
}
.nav-thumbnail {flex:0 .2 140px;}
.nav-thumbnail:empty { display: none;}
.nav-thumbnail img {
    width: 100%;
    height:100%;
    object-fit: cover;
    display: block;
}
.nav-content {
	flex:1 1 auto;
    display: grid;
    grid-template-rows: 1em auto;
    padding: 1rem;
    gap:8px;
    align-content: center;
}
.nav-label {
    font-size: 0.8rem;
    color: #666;
    display: block;
}
.nav-title {
    font-weight: bold;
    color: #222;
    display: block;
}

/*----- Pagination ------*/
.nav-links {
	display: flex;
	margin:auto;
	text-align: center;
	justify-content: center;
}
.nav-links .page-numbers {
	border:solid 1px rgba(0,30,60,.45);
	padding:6px 12px;
	margin:2px;
	text-align: center;
	background:#eaf2f8;
	color:#222;
	text-decoration: none;
}
.nav-links .page-numbers.current {
	background:#468;
	border:none;
	color:#fff;
}

/*------------------- Comments Section -----------------------*/

#comments {clear:both; }

.comments-dropdown {display:block;}

.number-of-comments {
font-size:1.8em;
font-weight:bold;
position:relative;
border-bottom:solid 3px;
padding-bottom:4px;
margin-bottom:12px;
}
.comments-dropdown summary:hover { background:#ddf4ff; }

.all-comments {
margin:0; padding:0;
}

.comments ul { padding:0px; margin:8px 0;}

.comments li {
margin:1rem 0 0 0;
padding: 1rem 0 0 40px;
list-style:none;
border-top:solid 1px #aaa;
position:relative;
}
.comment-body {position:relative; }

.reply {position:absolute; top:0; right:0; }
.avatar  {position:absolute; top:0; left:-40px;}

.comment-notes {font-size:14px;}


#respond {  padding:0px 12px;}
#respond p {margin:4px 0;}

#respond .stars { font-size:1.4rem; }

.comment-form-comment , .form-submit {margin:0;}

.comment-form input, .comment-form textarea {
border:solid 1px #bbb;
box-shadow:inset 2px 2px 6px rgba(0,0,0,.15);
font:inherit;
width:100%;
padding:8px;
}
.comment-form input[type=checkbox], .comment-form input[type=radio] {
	width:auto; 
}

#comment {height:4em; transition:.45s cubic-bezier(.08,.82,.17,1); }
#comment:focus {height:10em;}

.comment-form input:focus, .comment-form textarea:focus {border:solid 1px #456;}
.comment-form input.submit { background:#eee; box-shadow:0 1px 2px rgba(0,0,0,.15); margin:16px 0; }

.logged-in-as {display:none; margin:0; }
.logged-in-as a {font-size:.85em; padding:8px; border:solid 1px; border-radius:3px; text-decoration:none; line-height:1; }