/* ============================================
 * Category Page Transparent Container
 * ============================================
 * Makes the container background transparent on category pages
 * to allow the background to show through
 * Aligned with archives page style
 */

/* Target the main category container - enhanced selector */
#content-inner>#category,
#category,
div#category,
main#content-inner #category,
.layout_category #content-inner,
.layout_category #page {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Target category post items - match archives page style */
/* Exclude year items from background styling */
#category .recent-post-item,
#category .article-sort-item:not(.year),
.layout_category .article-sort-item:not(.year) {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
}

/* Year divider - transparent background, bold text with shadow */
#category .article-sort-item.year,
.layout_category .article-sort-item.year {
    background: transparent !important;
    border: none !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6) !important;
    padding-bottom: 8px !important;
    margin-bottom: 20px !important;
}

/* Dark Background - ONLY if body has dark-background class */
body.dark-background #category .recent-post-item,
body.dark-background #category .article-sort-item:not(.year),
body.dark-background .layout_category .article-sort-item:not(.year) {
    background: rgba(40, 40, 40, 0.7) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Year divider in dark background - keep transparent */
body.dark-background #category .article-sort-item.year,
body.dark-background .layout_category .article-sort-item.year {
    background: transparent !important;
    border: none !important;
    color: #ffffff !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6) !important;
}

/* Article Item Text - Dark by default, light on dark backgrounds */
#category .article-sort-item .article-sort-item-title,
#category .article-sort-item-time,
.layout_category .article-sort-item .article-sort-item-title,
.layout_category .article-sort-item-time {
    color: rgb(76, 73, 72) !important;
}

body.dark-background #category .article-sort-item .article-sort-item-title,
body.dark-background #category .article-sort-item-time,
body.dark-background .layout_category .article-sort-item .article-sort-item-title,
body.dark-background .layout_category .article-sort-item-time {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* Make sidebar cards semi-transparent */
#aside-content .card-widget {
    background: rgba(255, 255, 255, 0.8) !important;
    backdrop-filter: blur(10px) !important;
}

/* Ensure sidebar container is transparent */
#aside-content {
    background: transparent !important;
}

/* Ensure article-sort container is transparent on category pages */
.layout_category .article-sort,
#category .article-sort {
    background: transparent !important;
}