/*
Theme Name: Modern Times
Theme URI: https://modern-times.example.com
Author: AI Studio
Description: A modern, immersive news theme with Noto Serif typography and high-impact imagery.
Version: 1.0.0
Text Domain: modern-times
*/

/* Core Colors & Dark Mode Variables */
:root {
    --background: 0 0% 100%;
    --foreground: 240 10% 3.9%;
    --card: 0 0% 100%;
    --card-foreground: 240 10% 3.9%;
    --popover: 0 0% 100%;
    --popover-foreground: 240 10% 3.9%;
    --primary: 240 5.9% 10%;
    --primary-foreground: 0 0% 98%;
    --secondary: 240 4.8% 95.9%;
    --secondary-foreground: 240 5.9% 10%;
    --muted: 240 4.8% 95.9%;
    --muted-foreground: 240 3.8% 46.1%;
    --accent: 240 4.8% 95.9%;
    --accent-foreground: 240 5.9% 10%;
    --destructive: 0 84.2% 60.2%;
    --destructive-foreground: 0 0% 98%;
    --border: 240 5.9% 90%;
    --input: 240 5.9% 90%;
    --ring: 240 5.9% 10%;
    --radius: 0.5rem;
}

.dark {
    --background: 240 10% 3.9%;
    --foreground: 0 0% 98%;
    --card: 240 10% 3.9%;
    --card-foreground: 0 0% 98%;
    --popover: 240 10% 3.9%;
    --popover-foreground: 0 0% 98%;
    --primary: 0 0% 98%;
    --primary-foreground: 240 5.9% 10%;
    --secondary: 240 3.7% 15.9%;
    --secondary-foreground: 0 0% 98%;
    --muted: 240 3.7% 15.9%;
    --muted-foreground: 240 5% 64.9%;
    --accent: 240 3.7% 15.9%;
    --accent-foreground: 0 0% 98%;
    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 0 0% 98%;
    --border: 240 3.7% 15.9%;
    --input: 240 3.7% 15.9%;
    --ring: 240 4.9% 83.9%;
}

/* Core Reset */
html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    overflow-x: hidden;
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Ensure images don't overflow */
img {
    max-width: 100%;
    height: auto;
}

/* Fix for WordPress Core Gallery/Images */
.wp-block-image img {
    height: auto;
}

/* Hide admin bar if it causes layout shift issues in preview, but keeping standard for real WP */
#wpadminbar {
    opacity: 0.8;
}

/* Custom Transitions */
#mobile-menu {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

#mobile-menu.translate-x-full {
    transform: translateX(100%);
}

#mobile-menu:not(.translate-x-full) {
    transform: translateX(0);
}

.search-overlay-open {
    overflow: hidden;
}

/* Fix for WordPress image alignment */
.aligncenter {
    display: block;
    margin: 2rem auto;
}

.alignleft {
    float: left;
    margin: 0.5rem 1.5rem 1.5rem 0;
}

.alignright {
    float: right;
    margin: 0.5rem 0 1.5rem 1.5rem;
}

.alignwide {
    margin-left: -5vw;
    margin-right: -5vw;
    width: 110vw !important;
    max-width: 110vw !important;
}

.alignfull {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    width: 100vw !important;
    max-width: 100vw !important;
}

/* Category Page Specifics */
.archive-header {
    background-image: radial-gradient(circle at top right, hsla(var(--primary) / 0.05), transparent);
}

/* Boost gradient visibility in dark mode (primary becomes near-white) */
.dark .archive-header {
    background-image: radial-gradient(circle at top right, hsla(var(--primary) / 0.15), transparent);
}

/* Single Article Content */
.article-content > p:first-of-type::first-letter {
    font-size: 3rem;
    line-height: 1;
    font-weight: 700;
    margin-right: 0.75rem;
    float: left;
}

/* Dark-mode prose styles (replaces missing prose-invert from Typography plugin) */
.dark .article-content a {
    color: hsl(var(--primary));
    text-decoration-color: hsl(var(--primary) / 0.4);
}
.dark .article-content blockquote {
    border-left-color: hsl(var(--border));
    color: hsl(var(--muted-foreground));
}
.dark .article-content code {
    background-color: hsl(var(--muted));
    color: hsl(var(--foreground));
    padding: 0.15em 0.35em;
    border-radius: 0.25rem;
}
.dark .article-content pre {
    background-color: hsl(var(--muted));
    border: 1px solid hsl(var(--border));
}
.dark .article-content hr {
    border-color: hsl(var(--border));
}
.dark .article-content h2,
.dark .article-content h3,
.dark .article-content h4,
.dark .article-content h5 {
    color: hsl(var(--foreground));
}
.dark .article-content strong {
    color: hsl(var(--foreground));
}
.dark .article-content thead {
    border-bottom-color: hsl(var(--border));
    color: hsl(var(--foreground));
}
.dark .article-content tbody tr {
    border-bottom-color: hsl(var(--border) / 0.5);
}

/* Pagination Styles */
.pagination .nav-links {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.pagination .page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 2.5rem;
    min-width: 2.5rem;
    padding: 0 0.75rem;
    border-radius: 0.375rem;
    border: 1px solid hsl(var(--border));
    font-size: 0.875rem;
    font-weight: 700;
    color: hsl(var(--foreground));
    transition: all 0.2s;
}

.pagination .page-numbers:hover:not(.current) {
    background-color: hsl(var(--muted));
    border-color: hsl(var(--muted-foreground) / 0.5);
}

.pagination .page-numbers.current {
    background-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
    border-color: hsl(var(--primary));
}

.pagination .prev.page-numbers,
.pagination .next.page-numbers {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.75rem;
}

/* Dark Mode Refinements */
.dark .sticky {
    border-bottom-color: hsl(var(--border) / 1.5);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.3), 0 2px 4px -2px rgb(0 0 0 / 0.3);
}

.dark .search-open:hover,
.dark .theme-toggle:hover {
    background-color: hsl(var(--muted) / 0.8);
    border-color: hsl(var(--border));
}

.dark .article-content blockquote {
    background-color: hsl(var(--muted) / 0.3);
}

.dark .article-card-meta {
    color: hsl(var(--foreground) / 0.7);
}

.dark #search-live-results a {
    border-bottom-color: hsl(var(--border) / 0.5);
}

.dark section div.border-b {
    border-bottom-color: hsl(var(--border) / 0.8);
}



