/* ============================================================
   ALMOST SUNNY — Custom CSS v4
   Theme: Twenty Twenty-Five (dark)

   v4 key changes:
   - Feed badges: ::before on .wp-block-post-title (hardcoded hex)
   - Left bar: box-shadow inset (not border-left — zero conflict)
   - All other v3 working rules kept
   ============================================================ */
/* ══════════════════════════════════════════════════════════
   1. NAVIGATION
   ══════════════════════════════════════════════════════════ */
.wp-block-navigation a[href*="subscribe"] {
	border: .5px solid #3a3a24 !important;
	border-radius: 12px !important;
	padding: 3px 12px !important;
	color: #c8a060 !important;
	text-decoration: none !important;
}

.wp-block-navigation a[href*="subscribe"]:hover {
	background: rgba(200,160,80,0.08) !important;
}

.wp-block-navigation .current-menu-item > a,
.wp-block-navigation .current_page_item > a {
	text-decoration: underline !important;
	text-underline-offset: 3px !important;
	color: #e4e4e2 !important;
}

/* ══════════════════════════════════════════════════════════
   2. "STORIES" HEADING ACCENT (homepage)
   ══════════════════════════════════════════════════════════ */
.wp-block-query-title,
.home h1.wp-block-heading {
	position: relative;
	padding-bottom: 12px !important;
	margin-bottom: 20px !important;
}

.wp-block-query-title::after,
.home h1.wp-block-heading::after {
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 36px;
	height: 2px;
	background: #6a5030;
}

/* ══════════════════════════════════════════════════════════
   3. FEED CATEGORY BADGES
   
   TT25's query loop template (homepage + archives + More Posts)
   does NOT include the Post Terms block. We inject a coloured
   pill above the title using ::before on .wp-block-post-title.
   
   CRITICAL: All colours are hardcoded hex. CSS variables
   (var(--x)) were the failure point in v1 and v2 — they
   rendered as default/white. Hardcoded hex is non-negotiable.
   
   display: block makes the badge its own line above the title.
   width: fit-content stops it stretching full width.
   ══════════════════════════════════════════════════════════ */
.wp-block-query .wp-block-post-title::before {
	display: block !important;
	font-size: 10px !important;
	font-weight: 500 !important;
	padding: 2px 9px !important;
	border-radius: 3px !important;
	letter-spacing: .05em !important;
	line-height: 1.7 !important;
	margin-bottom: 9px !important;
	width: fit-content;
}

.wp-block-query .category-good-news .wp-block-post-title::before {
	content: "Good News" !important;
	background: #0d2e12 !important;
	color: #4caf60 !important;
	border: .5px solid #1a4a1e !important;
}

.wp-block-query .category-technology .wp-block-post-title::before {
	content: "Technology" !important;
	background: #0d1e35 !important;
	color: #5a9fd4 !important;
	border: .5px solid #1a3050 !important;
}

.wp-block-query .category-science .wp-block-post-title::before {
	content: "Science" !important;
	background: #0d2828 !important;
	color: #3db8a8 !important;
	border: .5px solid #1a4040 !important;
}

.wp-block-query .category-wellness .wp-block-post-title::before {
	content: "Wellness" !important;
	background: #221538 !important;
	color: #a07ad4 !important;
	border: .5px solid #3a2558 !important;
}

.wp-block-query .category-wallpapers .wp-block-post-title::before {
	content: "Wallpapers" !important;
	background: #2a1e0d !important;
	color: #d49a3a !important;
	border: .5px solid #4a3018 !important;
}

.wp-block-query .category-blog .wp-block-post-title::before {
	content: "Blog" !important;
	background: #2a2a2a !important;
	color: #aaaaaa !important;
	border: .5px solid #444444 !important;
}

/* ══════════════════════════════════════════════════════════
   4. LEFT ACCENT BAR (feed)
   
   Uses box-shadow inset instead of border-left.
   Reason: TT25 uses border-inline-start (logical property).
   Overriding it via border-left-color doesn't work.
   box-shadow is a completely separate property — it cannot
   be overridden by any border rule. 100% reliable.
   ══════════════════════════════════════════════════════════ */
.wp-block-query .wp-block-post-title {
	padding-left: 12px !important;
}

.wp-block-query .category-good-news .wp-block-post-title {
	box-shadow: inset 3px 0 0 0 #2a5e30 !important;
}

.wp-block-query .category-technology .wp-block-post-title {
	box-shadow: inset 3px 0 0 0 #1e4a78 !important;
}

.wp-block-query .category-science .wp-block-post-title {
	box-shadow: inset 3px 0 0 0 #1a5050 !important;
}

.wp-block-query .category-wellness .wp-block-post-title {
	box-shadow: inset 3px 0 0 0 #4a2888 !important;
}

.wp-block-query .category-wallpapers .wp-block-post-title {
	box-shadow: inset 3px 0 0 0 #6a4818 !important;
}

.wp-block-query .category-blog .wp-block-post-title {
	box-shadow: inset 3px 0 0 0 #444444 !important;
}

/* ══════════════════════════════════════════════════════════
   5. FEED — TITLES, EXCERPTS, META, READ MORE
   ══════════════════════════════════════════════════════════ */
.wp-block-query .wp-block-post-title a {
	color: #e0e0de !important;
	text-decoration: none !important;
}

.wp-block-query .wp-block-post-title a:hover {
	color: #ffffff !important;
}

.wp-block-query .wp-block-post-excerpt p {
	color: #787876 !important;
	font-size: 13px !important;
	line-height: 1.6 !important;
}

.wp-block-query .wp-block-post-date,
.wp-block-query .wp-block-post-date a {
	color: #555555 !important;
	font-size: 11px !important;
	text-decoration: none !important;
}

/* Read more link */
.wp-block-post-excerpt__more-link,
.wp-block-read-more {
	font-size: 11px !important;
	font-weight: 500 !important;
	text-decoration: none !important;
}

.wp-block-post-excerpt__more-link::after,
.wp-block-read-more::after {
	content: " 92" !important;
}

.category-good-news  .wp-block-post-excerpt__more-link,
.category-good-news  .wp-block-read-more {
	color: #4caf60 !important;
}

.category-technology .wp-block-post-excerpt__more-link,
.category-technology .wp-block-read-more {
	color: #5a9fd4 !important;
}

.category-science    .wp-block-post-excerpt__more-link,
.category-science    .wp-block-read-more {
	color: #3db8a8 !important;
}

.category-wellness   .wp-block-post-excerpt__more-link,
.category-wellness   .wp-block-read-more {
	color: #a07ad4 !important;
}

.category-wallpapers .wp-block-post-excerpt__more-link,
.category-wallpapers .wp-block-read-more {
	color: #d49a3a !important;
}

/* Wallpaper posts in feed — no background needed.
   The amber badge + left bar already distinguish them.
   A background on the  fills the full page-width section. */
/* ══════════════════════════════════════════════════════════
   6. SINGLE POST TERMS BADGE
   ══════════════════════════════════════════════════════════ */
.wp-block-post-terms a {
	display: inline-block !important;
	font-size: 10px !important;
	font-weight: 500 !important;
	padding: 2px 9px !important;
	border-radius: 3px !important;
	text-decoration: none !important;
	letter-spacing: .04em !important;
	line-height: 1.7 !important;
}

.category-good-news  .wp-block-post-terms a {
	background: #0d2e12 !important;
	color: #4caf60 !important;
	border: .5px solid #1a4a1e !important;
}

.category-technology .wp-block-post-terms a {
	background: #0d1e35 !important;
	color: #5a9fd4 !important;
	border: .5px solid #1a3050 !important;
}

.category-science    .wp-block-post-terms a {
	background: #0d2828 !important;
	color: #3db8a8 !important;
	border: .5px solid #1a4040 !important;
}

.category-wellness   .wp-block-post-terms a {
	background: #221538 !important;
	color: #a07ad4 !important;
	border: .5px solid #3a2558 !important;
}

.category-wallpapers .wp-block-post-terms a {
	background: #2a1e0d !important;
	color: #d49a3a !important;
	border: .5px solid #4a3018 !important;
}

.category-blog       .wp-block-post-terms a {
	background: #2a2a2a !important;
	color: #aaaaaa !important;
	border: .5px solid #444444 !important;
}

/* ══════════════════════════════════════════════════════════
   7. SINGLE POST PAGES
   ══════════════════════════════════════════════════════════ */
/* Coloured top border on the article */
body.single-post.category-good-news  article {
	border-top: 3px solid #2a5e30 !important;
}

body.single-post.category-technology article {
	border-top: 3px solid #1e4a78 !important;
}

body.single-post.category-science    article {
	border-top: 3px solid #1a5050 !important;
}

body.single-post.category-wellness   article {
	border-top: 3px solid #4a2888 !important;
}

body.single-post.category-wallpapers article {
	border-top: 3px solid #d49a3a !important;
}

body.single-post.category-blog       article {
	border-top: 3px solid #555555 !important;
}

/*
   H2 headings inside post content.
   NO font-size override — that was making headings smaller
   than body text in v1/v2. Let TT25 size them naturally.
   We only add the coloured left accent bar via box-shadow.
*/
/*
   H2 accent bar — uses ::before positioned to the LEFT of the heading.
   NO padding-left on the heading itself, so text stays flush with body.
   The 3px bar sits in the left margin area, 10px to the left of the text.
*/
.single-post .wp-block-post-content h2,
.single-post .wp-block-post-content .wp-block-heading {
	position: relative !important;
	padding-left: 0 !important;
	margin-top: 16px !important;
	margin-bottom: 8px !important;
}

.single-post .wp-block-post-content h2::before,
.single-post .wp-block-post-content .wp-block-heading::before {
	content: "" !important;
	position: absolute !important;
	left: -10px !important;
	top: 4px !important;
	bottom: 4px !important;
	width: 3px !important;
	display: block !important;
	border-radius: 0;
}

body.single-post.category-good-news  .wp-block-post-content h2::before,
body.single-post.category-good-news  .wp-block-post-content .wp-block-heading::before {
	background: #2a5e30 !important;
}

body.single-post.category-technology .wp-block-post-content h2::before,
body.single-post.category-technology .wp-block-post-content .wp-block-heading::before {
	background: #1e4a78 !important;
}

body.single-post.category-science    .wp-block-post-content h2::before,
body.single-post.category-science    .wp-block-post-content .wp-block-heading::before {
	background: #1a5050 !important;
}

body.single-post.category-wellness   .wp-block-post-content h2::before,
body.single-post.category-wellness   .wp-block-post-content .wp-block-heading::before {
	background: #4a2888 !important;
}

body.single-post.category-wallpapers .wp-block-post-content h2::before,
body.single-post.category-wallpapers .wp-block-post-content .wp-block-heading::before {
	background: #d49a3a !important;
}

body.single-post.category-blog       .wp-block-post-content h2::before,
body.single-post.category-blog       .wp-block-post-content .wp-block-heading::before {
	background: #666666 !important;
}

/* Content links per category */
body.single-post.category-good-news  .wp-block-post-content a {
	color: #4caf60 !important;
}

body.single-post.category-technology .wp-block-post-content a {
	color: #5a9fd4 !important;
}

body.single-post.category-science    .wp-block-post-content a {
	color: #3db8a8 !important;
}

body.single-post.category-wellness   .wp-block-post-content a {
	color: #a07ad4 !important;
}

body.single-post.category-wallpapers .wp-block-post-content a {
	color: #d49a3a !important;
}

/* Separator blocks */
.single-post .wp-block-post-content .wp-block-separator,
.single-post .wp-block-post-content hr {
	border: none !important;
	border-top: .5px solid #222222 !important;
	margin: 24px 0 !important;
	max-width: 100% !important;
	opacity: 1 !important;
}

/* JS helper classes (for · · · separator and read time) */
.as-story-sep {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	margin: 22px 0 !important;
	padding: 0 !important;
}

.as-sep-line {
	flex: 1;
	height: .5px;
	background: #1e1e1e;
	display: block;
}

.as-sep-dot {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #2e2e2e;
	display: block;
	flex-shrink: 0;
}

.as-read-time, .as-meta-sep {
	font-size: 11px;
	color: #555;
}

/* Prev/Next navigation cards */
.wp-block-post-navigation-link {
	border: .5px solid #1e1e1e !important;
	border-radius: 8px !important;
	padding: 12px 14px !important;
	display: block !important;
}

.wp-block-post-navigation-link:hover {
	border-color: #333333 !important;
}

.wp-block-post-navigation-link a {
	text-decoration: none !important;
	color: #888888 !important;
	font-size: 12px !important;
}

.wp-block-post-navigation-link .wp-block-post-navigation-link__label {
	display: block;
	font-size: 10px !important;
	text-transform: uppercase;
	letter-spacing: .07em;
	color: #444444 !important;
	margin-bottom: 5px;
}

/* ══════════════════════════════════════════════════════════
   8. CATEGORY ARCHIVE PAGES
   ══════════════════════════════════════════════════════════ */
/* Archive header — hide "Category:" prefix, show only the name.
   Makes "Category: Good News" read as just "Good News".
   Technique: transparent text on h1, ::before overlays the name.
   The ::after accent underline is unaffected. */
.archive h1.wp-block-heading,
.archive .wp-block-query-title {
	position: relative !important;
	color: transparent !important;
	padding-bottom: 14px !important;
	margin-bottom: 24px !important;
}

.archive h1.wp-block-heading::before,
.archive .wp-block-query-title::before {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	color: #e0e0de !important;
	line-height: inherit !important;
}

body.category-good-news.archive  h1::before,
body.category-good-news.archive  .wp-block-query-title::before {
	content: "Good News" !important;
}

body.category-technology.archive h1::before,
body.category-technology.archive .wp-block-query-title::before {
	content: "Technology" !important;
}

body.category-science.archive    h1::before,
body.category-science.archive    .wp-block-query-title::before {
	content: "Science" !important;
}

body.category-wellness.archive   h1::before,
body.category-wellness.archive   .wp-block-query-title::before {
	content: "Wellness" !important;
}

body.category-wallpapers.archive h1::before,
body.category-wallpapers.archive .wp-block-query-title::before {
	content: "Wallpapers" !important;
}

body.category-blog.archive       h1::before,
body.category-blog.archive       .wp-block-query-title::before {
	content: "Blog" !important;
}

.archive h1.wp-block-heading::after,
.archive .wp-block-query-title::after {
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 44px;
	height: 3px;
	background: #333333;
}

body.category-good-news.archive  h1::after {
	background: #2a5e30 !important;
}

body.category-technology.archive h1::after {
	background: #1e4a78 !important;
}

body.category-science.archive    h1::after {
	background: #1a5050 !important;
}

body.category-wellness.archive   h1::after {
	background: #4a2888 !important;
}

body.category-wallpapers.archive h1::after {
	background: #d49a3a !important;
}

/* Wallpapers archive — no custom layout.
   Displays like any other category page (single column).
   Featured images show naturally via TT25's template. */
body.category-wallpapers .wp-block-post-template .wp-block-post-title a {
	color: #e0e0de !important;
}

/* ══════════════════════════════════════════════════════════
   9. SUBSCRIBE PAGE
   ══════════════════════════════════════════════════════════ */
.wp-block-jetpack-subscriptions__form input[type="email"] {
	background: #1a1a1a !important;
	border: .5px solid #2e2e2e !important;
	color: #e0e0de !important;
	border-radius: 6px !important;
	padding: 10px 14px !important;
	font-size: 13px !important;
}

.wp-block-jetpack-subscriptions__form input[type="email"]::placeholder {
	color: #555555 !important;
}

.wp-block-jetpack-subscriptions__form input[type="submit"],
.wp-block-jetpack-subscriptions__form button[type="submit"] {
	background: #2a1e0d !important;
	color: #d49a3a !important;
	border: .5px solid #4a3018 !important;
	border-radius: 6px !important;
	padding: 10px 22px !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	cursor: pointer !important;
}

.wp-block-jetpack-subscriptions__form input[type="submit"]:hover,
.wp-block-jetpack-subscriptions__form button[type="submit"]:hover {
	background: #3a2a12 !important;
}

/* ══════════════════════════════════════════════════════════
   10. ABOUT PAGE + FOOTER
   ══════════════════════════════════════════════════════════ */
.page .wp-block-separator, .page hr {
	border: none !important;
	max-width: 48px !important;
	height: 2px !important;
	background: #2e2e2a !important;
	margin: 28px auto !important;
	opacity: 1 !important;
}

footer.wp-block-template-part a, .site-footer a {
	color: #c8a060;
	text-decoration: none;
}

footer.wp-block-template-part a:hover, .site-footer a:hover {
	color: #e0c080;
}