@charset "UTF-8";
/**
 * Name: Clarified Premium
 * Plugin URI: https://www.roughpixels.com
 * Description: Styles for the Clarified premiium features.
 * Author: roughpixels
 * Author URI: https://www.roughpixels.com
 * Version: 1.0.1
 * License: GPL2+
 * License URI: https://www.gnu.org/licenses/gpl-2.0.txt
 *
 */

/* Header Styles
 ==================================================== */
.header-alternate #site-branding,
.header-minimal #site-branding {
  margin-bottom: 1.125rem;
  text-align: center;
}

.header-alternate .site-title,
.header-alternate .site-title a,
.header-minimal .site-title,
.header-minimal .site-title a {
  text-decoration: none !important;
  font-size: 2rem;
  font-weight: 600;
}

.header-minimal #nav-container {
  border-radius: var(--clarified-border-radius);
}

.site-description {
  font-size: 0.688rem;
}

.site-description::before {
  width: 10%;
}

/* Blog Styles
 ==================================================== */
.blog-minimal.blog-sidebar .entry-content {
  max-width: 860px;
  text-align: left;
}



.blog-minimal.blog-sidebar .entry-footer {
  justify-content: left;
}

.blog-minimal.no-sidebar .entry-footer {
  justify-content: center;
}


.blog-minimal.no-sidebar #page-header,
.blog-minimal.no-sidebar .summary-content {
	text-align: center;
	margin-inline: auto;
}

.blog-minimal.no-sidebar .summary-content {
    max-width: 860px;
    margin-inline: auto;
}


.blog-list .featured-category-wrap::before {
  left: 0;
  content: none;
}

.blog-grid .entry-footer,
.blog-masonry .entry-footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.blog-grid ul.post-meta,
.blog-masonry ul.post-meta {
  display: block;
}

.blog-grid .post-meta li,
.blog-masonry .post-meta li {
  display: inline-block;
  margin: 0;
  text-align: left;
}

.blog-grid .readmore-wrapper,
.blog-masonry .readmore-wrapper {
  padding-right: 0;
}

.blog-grid .readmore-wrapper::after,
.blog-masonry .readmore-wrapper::after {
  content: none;
}

/* Base styles for the list wrapper */
.blog-list .post-summary,
.list-wrapper {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 2rem;
}

.blog-list .entry-header {
  text-align: left;
}

/* Styles for the image container */
.blog-list .post-summary .post-thumbnail,
.list-image {
  width: 100%;
}

.blog-masonry .entry-content,
.blog-list .entry-content,
.blog-grid .entry-content,
.blog-gallery .entry-content {
  font-size: 0.938rem;
}

.blog-grid .entry-title,
.blog-masonry .entry-title,
.blog-gallery .entry-title,
.blog-list .entry-title {
  text-align: left;
  font-size: 1.5rem;
  margin-bottom: 1rem;
}

.blog-list.blog-sidebar .post-thumbnail {
  margin-bottom: 0;
}

.blog-grid figcaption.wp-caption-text,
.blog-gallery figcaption.wp-caption-text,
.blog-list figcaption.wp-caption-text,
.blog-masonry figcaption.wp-caption-text,
.blog-list .comments-link,
.blog-grid .comments-link,
.blog-masonry .comments-link {
  display: none;
}

/* Base CSS for Mobile First: Single Column Layout */
.blog-grid #post-summaries,
.blog-gallery #post-summaries {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

/* Base CSS for Mobile First: Full Width for Small Screens */
.blog-masonry #post-summaries .hentry {
  width: 100%;
  margin-bottom: 3rem;
}

.blog-gallery .sticky {
  display: contents;
}

.blog-gallery .hentry {
  margin-bottom: 0;
}

.blog-gallery .gallery-image {
  border-radius: var(--clarified-border-radius);
  position: relative;
  background-size: cover;
  background-position: center;
  height: 500px;
}

.blog-gallery .entry-title {
  border-radius: 0 0 var(--clarified-border-radius)
    var(--clarified-border-radius);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 0.75rem;
  margin: 0;
  font-size: 1rem;
  text-align: center;
}
.blog-gallery .entry-title a {
  color: white;
  text-decoration: none;
}

.masonry-image,
.blog-list .post-summary .post-thumbnail,
.list-image,
.grid-image,
.gallery-image {
  cursor: pointer;
  transition: filter 0.3s ease; /* Smooth transition for the filter effect */
}

.masonry-image:hover,
.blog-list .post-summary .post-thumbnail:hover,
.list-image:hover,
.grid-image:hover,
.gallery-image:hover {
  filter: saturate(50%);
}

.blog-gallery .entry-title:hover {
  background-color: rgba(0, 0, 0, 0.75);
}


/* Full posts
   ==================================================== */
   
.single.post-center article>*:not(.post-thumbnail),
.single.post-center .comments-area,
.single.post-center .post-navigation {
    max-width: 860px;
    margin-inline: auto;
}

/* Related posts
   ==================================================== */
.related-section-heading {
  font-size: 1.125rem;
}

.related-post {
  display: block;
  text-align: center;
  margin-bottom: 3rem;
}

.related-post:last-child {
  margin-bottom: 0;
}

.related-post a.post-thumbnail {
  display: block;
  margin: 0.875rem 0;
}

.related-post.has-post-thumbnail img {
  width: 100%;
}

.related-post-title {
  font-size: 1.25rem;
  color: inherit;
  margin-bottom: 0.5rem;
  display: block;
  text-decoration: none;
  font-weight: 600;
  line-height: 1.2;
}

.related-post .entry-meta {
  font-size: 0.75rem;
  margin-bottom: 0.625rem;
}

.related-post-excerpt {
  font-size: 0.875rem;
  margin-bottom: 0.5rem;
}

/* CUSTOM WIDGETS - RECENT COMMENTS
   ==================================================== */
.clarified-recent-comments {
  display: flex;
  flex-direction: column;
  line-height: 1.3;
  list-style: none;
}

.clarified-recent-comment {
  align-items: center;
  display: flex;
  gap: 0.75rem;
}

.clarified-comment-avatar {
  flex-shrink: 0;
}

.clarified-comment-avatar img {
  border-radius: 0.25rem;
}

.clarified-comment-content {
  flex-grow: 1;
}

.clarified-comment-content a {
  font-family: var(--clarified-primary-italic-font);
  text-decoration: none;
}

.clarified-comment-author-link a {
  color: inherit;
}

/* CUSTOM WIDGETS - RECENT POSTS
   ==================================================== */
.clarified-recent-posts-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.clarified-recent-post-item {
  display: flex;
  gap: 1.125rem;
}

.clarified-recent-post-img-wrapper {
  flex-basis: 3.75rem;
}

.clarified-recent-post-img-wrapper img {
  border-radius: 0.25rem;
  max-width: 3.75rem;
}

.clarified-recent-post-title {
  font-size: 0.938rem;
  line-height: 1.3;
  margin: 0 0 0.25rem;
}

.clarified-recent-post-title a {
  color: inherit;
  font-weight: 400;
  text-decoration: none;
}

.clarified-recent-post-title a:focus,
.clarified-recent-post-title a:hover {
  color: var(--clarified-secondary);
}

.clarified-recent-post-date {
  color: var(--clarified-grey-600);
  font-size: small;
}

.clarified-recent-post-content {
  flex-grow: 1;
}

/* CUSTOM WIDGETS - About Me
   ==================================================== */
.clarified-aboutme-image {
  margin-bottom: 1.25rem;
}

.clarified-aboutme-name,
.clarified-aboutme-intro p {
  margin-bottom: 1rem;
}
.clarified-aboutme-name {
  font-size: 1.25rem;
  line-height: 1;
}

.clarified-aboutme-intro {
  font-size: 0.875rem;
  line-height: 1.6;
}

.clarified-aboutme-link {
  display: inline-block;
  text-decoration: none;
  color: currentColor;
  font-weight: 500;
  margin-left: 0.5rem;
  line-height: 1;
}

.clarified-aboutme-link:focus,
.clarified-aboutme-link:hover {
  color: var(--clarified-links);
}

.clarified-aboutme-intro .svg-icon {
  position: relative;
  bottom: 0.063rem;
}

/* Media Queries
   ==================================================== */

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .blog-masonry #post-summaries {
    margin-inline: -0.75rem;
  }
  .blog-masonry #post-summaries .hentry {
    width: 100%;
  }
  .blog-masonry.no-sidebar #post-summaries .hentry {
    width: 50%;
  }
  .blog-masonry .hentry {
    padding-inline: 0.75rem;
  }
  .related-post {
    display: flex;
    align-items: center;
    gap: 3rem;
    margin-bottom: 0;
    text-align: left;
  }
  .related-post:last-child {
    margin-bottom: initial;
  }
  .related-post a.post-thumbnail {
    width: 40%;
  }

  .related-post-content {
    width: 60%;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.blog-list .post-summary,
  .list-wrapper {
    flex-direction: row;
    flex-wrap: nowrap;
  }

.blog-list .post-summary .post-thumbnail,
  .list-image {
    max-width: 100%;
    flex: 0 0 230px; /* Fixed width for the image, adjust as needed */
  }

  /* Styles for the content container */
  .blog-list .post-summary .summary-content,
  .list-content {
    flex-grow: 1; /* Allows the content to fill the remaining space */
  }

  .blog-grid #post-summaries,
  .blog-gallery #post-summaries {
    grid-template-columns: repeat(2, 1fr);
  }
  .blog-grid.no-sidebar #post-summaries,
  .blog-gallery.no-sidebar #post-summaries {
    grid-template-columns: repeat(3, 1fr);
    /* Ensuring equal height for each article */
    align-items: stretch;
  }

  .blog-masonry.no-sidebar #post-summaries .hentry {
    width: 33.333%; /* Three columns layout for large screens */
  }
  .blog-masonry #post-summaries .hentry {
    width: 50%;
  }
}