@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600&family=Roboto:ital,wght@0,400;0,700;1,400;1,700&display=swap');

/*
 * =========================================================================
 * 1. DEVICE-SPECIFIC FALLBACKS FOR POPPINS (HEADINGS)
 * =========================================================================
 */

/* Windows: Century Gothic is naturally wide, scaled slightly down to match Poppins */
@font-face {
    font-family: "Poppins-Win-Fallback";
    src: local("Century Gothic");
    size-adjust: 99%;
    ascent-override: 100%;
}

/* macOS: Futura is geometric and wide, scaled slightly down to match Poppins */
@font-face {
    font-family: "Poppins-Mac-Fallback";
    src: local("Futura");
    size-adjust: 97%;
    ascent-override: 100%;
}

/* General: Arial is narrow, scaled up to match Poppins' width */
@font-face {
    font-family: "Poppins-Gen-Fallback";
    src: local("Arial");
    size-adjust: 105%;
    ascent-override: 105%;
    descent-override: 35%;
    line-gap-override: 10%;
}

/*
 * =========================================================================
 * 2. DEVICE-SPECIFIC FALLBACKS FOR ROBOTO (BODY)
 * =========================================================================
 */

/* Windows: Segoe UI scaled down slightly to match Roboto's letter spacing */
@font-face {
    font-family: "Roboto-Win-Fallback";
    src: local("Segoe UI");
    size-adjust: 96%;
}

/* macOS: System UI (San Francisco) optimized to match Roboto */
@font-face {
    font-family: "Roboto-Mac-Fallback";
    src: local("-apple-system"), local("BlinkMacSystemFont");
    size-adjust: 98%;
}

/* General: Arial optimized with precise metric offsets for Roboto */
@font-face {
    font-family: "Roboto-Gen-Fallback";
    src: local("Arial");
    size-adjust: 100.06%;
    ascent-override: 90.20%;
    descent-override: 22.48%;
    line-gap-override: 0.00%;
}

/*
 * =========================================================================
 * 3. STACK IMPLEMENTATION
 * =========================================================================
 */

/* Body Elements with Device-Specific Fallbacks */
body,
button,
input,
select,
textarea {
    font-family: "Roboto", "Roboto-Win-Fallback", "Roboto-Mac-Fallback", "Roboto-Gen-Fallback", sans-serif;
    font-weight: 400;
}

/* Headings with Device-Specific Fallbacks */
h1, h2, h3, h4, h5, h6,
.site-title,
.entry-title,
.entry-title a,
.widget .widget-title,
.main-navigation a {
    font-family: "Poppins", "Poppins-Win-Fallback", "Poppins-Mac-Fallback", "Poppins-Gen-Fallback", sans-serif;
    font-weight: 600;
}

/*
 * =========================================================================
 * 4. ACTIVE NAVIGATION INDICATOR (Bolder Border-Bottom Method)
 * =========================================================================
 */

/* Active State Underline */
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a {
    border-bottom: 3px solid currentColor;
    padding-bottom: 4px;
}

/* Hover State Underline transition */
.main-navigation a:hover {
    border-bottom: 3px solid rgba(0, 0, 0, 0.2);
    padding-bottom: 4px;
    transition: border-color 0.2s ease-in-out;
}

/*
 * =========================================================================
 * 5. SITE-WIDE RESPONSIVE SPACING & LINE HEIGHTS
 * =========================================================================
 */
/* Compress large default top padding in Twenty Sixteen header container */
.site-header {
    padding-top: 1.25rem !important; 
    padding-bottom: 1.0rem !important; /* Compress gap below menu on mobile */
}
@media screen and (min-width: 44.375em) {
    .site-header {
        padding-top: 1.6rem !important; 
        padding-bottom: 1.25rem !important; /* Compress gap below menu on tablet */
    }
}
@media screen and (min-width: 61.5625em) {
    .site-header {
        padding-top: 2.0rem !important; 
        padding-bottom: 1.5rem !important; /* Compress gap below menu on desktop */
    }
}

/* General subpages: Compress large default top padding in page content wrapper */
.site-content {
    padding-top: 0.5rem !important; /* Compress gap above page title on mobile (Adjust here) */
}
@media screen and (min-width: 44.375em) {
    .site-content {
        padding-top: 0.75rem !important; /* Compress gap above page title on desktop/tablet (Adjust here) */
    }
}

/* Homepage Only: Re-add buffer space to compensate for the missing page title */
.home .site-content {
    padding-top: 2.75rem !important; /* Front page top spacing buffer on mobile (unmodified) */
}
@media screen and (min-width: 44.375em) {
    .home .site-content {
        padding-top: 4.62rem !important; /* Front page top spacing buffer on desktop (increased by 20%) */
    }
}

/* Compress and standardize default page titles (.entry-title) */
.entry-title {
    font-size: 1.5rem !important; /* Mobile page title size (~24px) */
}
@media screen and (min-width: 44.375em) {
    .entry-title {
        font-size: 1.75rem !important; /* Tablet page title size (~28px) */
    }
}
@media screen and (min-width: 61.5625em) {
    .entry-title {
        font-size: 2.0rem !important; /* Desktop page title size (~32px, down from 40px) */
    }
}

/* Standardize Paragraph spacing using relative REM units */
p {
    margin-top: 0;
    margin-bottom: 1.5rem; /* Margins scale relative to the font size */
    line-height: 1.6;      /* Unitless line height for fluid readability */
}
/* Adjust heading vertical margins for structural rhythm */
h1, h2, h3, h4, h5, h6 {
    margin-top: 2rem;
    margin-bottom: 1rem;
    line-height: 1.25;     /* Slightly tighter line height for large headings */
}
/* Specific override for H3 headings inside page content to reduce space below them */
.entry-content h3 {
    margin-bottom: 0.75rem; /* Restored to your target spacing of 12px */
}
/* Standardize margins for Gutenberg column blocks */
.wp-block-columns {
    margin-bottom: 2rem;
}

/*
 * =========================================================================
 * 6. FOOTER REMEDIATION (Hiding Default Credits)
 * =========================================================================
 */
.site-info, 
.powered-by-wordpress, 
.footer-credits, 
.imprint,
.site-footer .copyright-bar {
    display: none !important;
}

/*
 * =========================================================================
 * 7. PERSISTENT BOOK NAVIGATION MENU (CATEGORIZED STICKY LAYOUT)
 * =========================================================================
 */

/* Reduces spacing between page titles and mini menus on desktop (Books = #post-68, Academic = #post-2) */
#post-68 .entry-header,
#post-2 .entry-header {
    margin-bottom: 1.5rem; /* overrides default twenty-sixteen 3.5rem margin */
}

.books-mini-menu {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 99999;
    
    /* Layout & Alignment */
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px; /* space between groups and dividers */
    
    /* Aesthetics & Glassmorphism */
    background-color: rgba(255, 255, 255, 0.60); /* 40% transparency (frosted glass) */
    -webkit-backdrop-filter: blur(10px); /* increased blur to protect text readability */
    backdrop-filter: blur(10px);
    
    /* Spacing & Borders */
    padding: 6px 15px; /* thinner layout height */
    margin: 0 0 35px 0; /* top margin zeroed to pull the menu upward */
    border-bottom: 1px solid #e0e0e0;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03);
}

/* Adjustments for the sticky menu when the WordPress Admin Bar is visible */
.logged-in .books-mini-menu {
    top: 32px;
}

@media screen and (max-width: 782px) {
    .logged-in .books-mini-menu {
        top: 46px;
    }
    
    #post-68 .entry-header,
    #post-2 .entry-header {
        margin-bottom: 1rem;
    }
}

/* Grouping Flex Box Layout */
.books-mini-menu .menu-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

/* Category Labels Styling (Updated: Larger font size) */
.books-mini-menu .group-title {
    font-family: "Poppins", "Poppins-Win-Fallback", "Poppins-Mac-Fallback", "Poppins-Gen-Fallback", sans-serif;
    font-size: 0.78rem; /* Increased size from 0.65rem */
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: #790604; /* Theme accent red */
    margin-right: 4px;
}

/* Central Divider styling */
.books-mini-menu .menu-divider {
    width: 1px;
    height: 18px;
    background-color: #dcdcdc;
    align-self: center;
}

/* Responsive constraints for tablet and mobile sizes */
@media screen and (max-width: 900px) {
    .books-mini-menu .menu-divider {
        display: none;
    }
    
    .books-mini-menu {
        justify-content: center;
        gap: 12px;
        padding: 8px 12px;
    }
    
    .books-mini-menu .menu-group {
        justify-content: center;
    }
}

/* Force category labels to sit above the book links on smartphones */
@media screen and (max-width: 600px) {
    .books-mini-menu .group-title {
        width: 100%;
        text-align: center;
        margin-right: 0;
        margin-bottom: 8px; /* Adds breathing room between the label and buttons */
    }
}

/* Compact Slate-Charcoal Link Buttons */
.books-mini-menu a {
    color: #ffffff !important; /* white button text */
    background-color: #2c3338; /* dark charcoal background */
    text-decoration: none;
    font-family: "Poppins", "Poppins-Win-Fallback", "Poppins-Mac-Fallback", "Poppins-Gen-Fallback", sans-serif;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 5px 12px;
    border: 1px solid #1a2024;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease-in-out;
    display: inline-block;
}

/* Hover and Focus Transitions */
.books-mini-menu a:hover,
.books-mini-menu a:focus {
    color: #ffffff !important;
    background-color: #790604 !important; /* fills with theme crimson */
    border-color: #790604 !important;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(121, 6, 4, 0.2);
}

/* Active Click Feedback */
.books-mini-menu a:active {
    transform: translateY(0px);
}

/*
 * =========================================================================
 * 8. SMOOTH SCROLLING & FOOTER SPACE RUNWAY
 * =========================================================================
 */
html {
    scroll-behavior: smooth;
}
/* Offset positioning targeting the media block elements and academic page headers (20px buffer) */
.wp-block-media-text[id],
h3[id] {
    scroll-margin-top: 110px;
}
/* Compact runway: allows the final book to align under the sticky menu 
   without creating an excessive empty white void before the footer */
.entry-content {
    padding-bottom: 150px; /* Compacted from 45vh to a fixed 150px */
}

/*
 * =========================================================================
 * 9. GUTENBERG LIST ITEM SPACING
 * =========================================================================
 */
/* Standardize font size, line-height, and vertical spacing for all lists */
.wp-block-list li {
    font-size: 1.0625rem !important; /* Standardize font size to match other lists */
    line-height: 1.5 !important;     /* Standardize line-height to fix spacing issues */
    margin-bottom: .3rem;            /* Creates a clean gap between publications */
}
/* Prevent double spacing at the very end of a list block */
.wp-block-list li:last-child {
    margin-bottom: 0;
}

/*
 * =========================================================================
 * 10. GUTENBERG MEDIA & TEXT MOBILE SPACING
 * =========================================================================
 */
@media screen and (max-width: 600px) {
    /* Add vertical spacing between stacked columns (image and text) */
    .wp-block-media-text.is-stacked-on-mobile {
        row-gap: 1.5rem !important;
    }
    /* Fallback spacer for older rendering engines */
    .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {
        margin-bottom: 1.5rem !important;
    }
}
