/* -------------------------------------------------------------------------- */
/*                                 BLOG PAGE STYLES                             */
/* -------------------------------------------------------------------------- */
.blog-posts-section {
    padding-bottom: 6rem; /* Add padding to the bottom */
}

body.dark-theme {
  background-color: #000;
  color: #fff;
}

/* Header override */
.dark-theme .glass-nav {
    background: rgba(10, 10, 10, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.1);
}
.dark-theme .nav-logo,
.dark-theme .nav-link {
    color: #fff;
}
.dark-theme .nav-link:hover {
    color: #FF007F;
}
.dark-theme .nav-link:hover::after {
    background: #FF007F;
}

/* Hero Section */
.dark-theme .hero-section {
    background-color: transparent;
    border-bottom-color: #333;
    position: relative; /* Ensure positioning context for video */
}
.dark-theme .hero-section h1 {
    color: #fff;
}
.dark-theme .hero-section p {
    color: #aaa;
}

/* Blog Cards */
.dark-theme .blog-card {
    background-color: #111;
    border: 1px solid #333;
    border-radius: 1rem;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: border-color 0.3s ease;
}

.dark-theme .blog-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #FD349C, #FF007F, #FF77FF, #FD349C);
    background-size: 200% auto;
    z-index: 1;
    border-radius: inherit;
    opacity: 0;
    transition: opacity 0.4s ease-in-out;
}

.dark-theme .blog-card > * {
    position: relative;
    z-index: 2;
}

.dark-theme .blog-card-link:hover .blog-card {
    border-color: transparent;
}

.dark-theme .blog-card-link:hover .blog-card::before {
    opacity: 1;
    animation: hologram-shine 2s linear infinite;
}

.dark-theme .blog-card-link:hover .blog-card-image-wrapper,
.dark-theme .blog-card-link:hover .blog-card-image-wrapper-small {
    background-color: transparent;
}

.dark-theme .blog-card-link:hover .blog-card h2,
.dark-theme .blog-card-link:hover .blog-card h3,
.dark-theme .blog-card-link:hover .blog-card p,
.dark-theme .blog-card-link:hover .blog-card .meta-text,
.dark-theme .blog-card-link:hover .cta-link,
.dark-theme .blog-card-link:hover .read-more-link {
    color: #000;
}

.dark-theme .blog-card-link:hover .cta-link {
    background-color: #000;
    color: #fff;
}
.dark-theme .blog-card h2,
.dark-theme .blog-card h3 {
    color: #fff;
}
.dark-theme .blog-card p {
    color: #aaa;
}
.dark-theme .blog-card .meta-text {
    color: #888;
}
.dark-theme .blog-card-image-wrapper,
.dark-theme .blog-card-image-wrapper-small {
    background-color: #222;
}
.dark-theme .cta-link {
    background-color: #FF007F;
    color: #fff;
}
.dark-theme .cta-link:hover {
    background-color: #fff;
    color: #FF007F;
}
.dark-theme .read-more-link {
    color: #FF007F;
    font-weight: bold;
    margin-top: 1rem; /* Add margin to the top */
}

/* Aside */
.dark-theme .aside-card {
    background-color: #111;
    border-color: #333;
}
.dark-theme .aside-card h3 {
    color: #fff;
}
.dark-theme .aside-card .aside-link {
    color: #aaa;
}
.dark-theme .aside-card .aside-link:hover {
    color: #FF007F;
}
.dark-theme .aside-card .count-text {
    color: #888;
}
.dark-theme .aside-card p {
    color: #aaa;
}
.dark-theme .newsletter-input {
    background-color: #222;
    border-color: #444;
    color: #fff;
}
.dark-theme .newsletter-input:focus {
    border-color: #FF007F;
    box-shadow: 0 0 0 3px rgba(255, 0, 127, 0.3);
}
.dark-theme .cta-button {
    background-color: #FF007F;
    color: #fff;
}
.dark-theme .cta-button:hover {
    background-color: #fff;
    color: #FF007F;
}