/*
 Description:  SoulDiscovery Site Body Content Variables Style Sheet
 Author:       Timothy Disney
 Author URI:   https://www.timothydisney.co.uk
 Version:      1.0
 Domain:       https://www.souldiscovery.co.uk
*/

/* ----------------------------- Style Sheet ----------------------------- */
/* INDEX:
- Body
-- Blog Index
-- Blog Post Pages
-- Custom Pages
- Responsive Formatting
*/

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ---------------------------------------------------------- Body Formatting ---------------------------------------------------------- */
/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* ---------------------------------------------------------- Blog Index ---------------------------------------------------------- */

#blog .wp-block-post-template {
    width: 95%;
    max-width: calc(380px * 4 + 20px * 3); /* 4 columns + 3 gaps */
    padding: 0;
    margin: 0 auto;
    list-style: none;
    display: grid;
     grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
     gap: 20px;
}

#blog :where(.is-layout-flow) > * {margin-block-start: unset;}

.main-blog-card {
    height: 100%;
    border: 1px solid var(--sd_grey-lt);
    border-bottom: 2px solid var(--sd_blue-lt); /* Note: Setup classes to dynamically change the bottom border dependent on post type. */
    border-radius: 8px;
    box-shadow: 0px 4px 12px 6px var(--sd_grey-lt);
    display: flex;
     flex-direction: column;
     align-items: center;
    opacity: 0;
    transform: translateY(8px);
    animation: fadeInCards 0.5s ease-out forwards;
}

.wp-block-post-template > li:nth-child(1) .main-blog-card { animation-delay: 0.08s; }
.wp-block-post-template > li:nth-child(2) .main-blog-card { animation-delay: 0.16s; }
.wp-block-post-template > li:nth-child(3) .main-blog-card { animation-delay: 0.24s; }
.wp-block-post-template > li:nth-child(4) .main-blog-card { animation-delay: 0.32s; }
.wp-block-post-template > li:nth-child(5) .main-blog-card { animation-delay: 0.40s; }
.wp-block-post-template > li:nth-child(6) .main-blog-card { animation-delay: 0.48s; }
.wp-block-post-template > li:nth-child(7) .main-blog-card { animation-delay: 0.56s; }
.wp-block-post-template > li:nth-child(8) .main-blog-card { animation-delay: 0.64s; }
.wp-block-post-template > li:nth-child(9) .main-blog-card { animation-delay: 0.72s; }
.wp-block-post-template > li:nth-child(10) .main-blog-card { animation-delay: 0.80s; }
.wp-block-post-template > li:nth-child(11) .main-blog-card { animation-delay: 0.88s; }
.wp-block-post-template > li:nth-child(12) .main-blog-card { animation-delay: 0.96s; }

@keyframes fadeInCards {
    to {
        opacity: 1;
        transform: translateY(0px);
    }
}

.blog-card-link a {color: var(--sd_blue-md);}

.main-blog-card-image {
    width: 100%;
    height: 200px;
    border-radius: 8px 8px 0px 0px;
    background-color: var(--sd_blue-dk);
    background-image: url("../images/sd_featuredImg_placeholder.jpg");
     background-size: cover;
     background-position: center center;
     background-repeat: no-repeat;
}

.main-blog-card-image .wp-block-post-featured-image :where(img) {
    max-height: 200px;
    border-radius: 8px 8px 0px 0px;
    object-position: top;
}

.main-blog-card-credit {
    width: 90%;
    margin: 8px 0px;
    font-weight: 600;
    display: flex;
     align-items: center;
     justify-content: space-between;
}

.main-blog-card-credit-date {}

.main-blog-card-credit-author {}
.main-blog-card-credit-author img {display: none;}

.main-blog-card-excerpt {
    width: 90%;
    flex-grow: 1;
}
.main-blog-card-excerpt h2 {
    margin-block-start: 0.3em;
    margin-block-end: 0.3em;
}
.main-blog-card-excerpt .entry-content {
    color: var(--sd_grey-dk);
    padding-right: unset;
    padding-left: unset;
}
.main-blog-card-excerpt .entry-content p {
    display: -webkit-box;
     -webkit-line-clamp: 8;
     -webkit-box-orient: vertical;
    overflow: hidden;
}
.main-blog-card-excerpt .more-link {color: var(--sd_blue-lt);}

.main-blog-card-footer {
    width: 90%;
    text-align: right;
    margin: 8px 0px;
}

#blog div:has(> .wp-block-query-pagination) {background-color: var(--sd_grey-bg);}


/* ---------------------------------------------------------- Blog Post Pages ---------------------------------------------------------- */

.wp-block-query-title {padding: 0px 0px 0px 20px;}

.wp-block-term-description {
    background-color: var(--sd_backdrop);
    padding: 12px 20px;
}

main:not(#blog) .wp-block-post-template li:nth-child(even) {
    background-color: var(--sd_grey-bg);
    border-top: 1px solid var(--sd_grey-lt);
    border-bottom: 1px solid var(--sd_grey-lt);
}


/* ---------------------------------------------------------- Custom Pages ---------------------------------------------------------- */

.page-id-14 h1.wp-block-post-title {display: none;}



/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* -------------------------------------------------------- Responsive Formatting -------------------------------------------------------- */
/* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */