/*
Theme Name: Elm Labs Theme
Theme URI: https://example.com/elm-labs
Author: Elm Research Laboratories
Description: A retro-futuristic CRT terminal theme for research laboratories.
Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&family=VT323&display=swap');

/* Base Settings */
body {
    background-color: #080808;
    color: #cccccc;
    font-family: 'Fira Code', monospace;
    overflow-x: hidden;
    font-size: 18px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'VT323', monospace;
    text-transform: uppercase;
}

/* Retro Scrollbar (Gray) */
::-webkit-scrollbar {
    width: 12px;
    background: #000;
    border-left: 1px solid #333;
}
::-webkit-scrollbar-thumb {
    background: #888;
    border: 2px solid #000;
}

/* CRT Effects - White/Gray Phosphor */
.crt::before {
    content: " ";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
    z-index: 50;
    background-size: 100% 2px, 3px 100%;
    pointer-events: none;
}

.scanline {
    width: 100%;
    height: 120px;
    z-index: 51;
    background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(255, 255, 255, 0.1) 50%, rgba(0,0,0,0) 100%);
    opacity: 0.1;
    position: fixed;
    top: -100px; /* Start position just above the viewport */
    animation: scanline 10s linear infinite;
    pointer-events: none;
}

@keyframes scanline {
    0% { transform: translateY(0); }
    40% { transform: translateY(0); }
    60% { transform: translateY(calc(100vh + 100px)); }
    100% { transform: translateY(calc(100vh + 100px)); }
}

.text-glow {
    text-shadow: 0 0 4px rgba(200, 200, 200, 0.5);
}

.border-glow {
    box-shadow: 0 0 4px rgba(200, 200, 200, 0.3);
}

/* WordPress Core Alignments */
.aligncenter { display: block; margin: 0 auto; }
.alignleft { float: left; margin-right: 1.5em; }
.alignright { float: right; margin-left: 1.5em; }

/* Content Links */
.entry-content a:not([class]),
.post-excerpt a:not([class]) {
    color: #fff;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    transition: all 0.2s ease;
}

.entry-content a:not([class]):hover,
.post-excerpt a:not([class]):hover {
    background-color: #fff;
    color: #000;
    text-decoration: none;
}

/* Paragraph Spacing */
.entry-content p {
    margin-bottom: 1.5em;
}

/* Navigation Menu */
nav .menu-item {
    list-style: none; /* Remove default browser bullet */
    position: relative;
}

/* Mobile Menu Specific Styles */
@media (max-width: 767px) {
    #mobile-menu .menu-item a {
        text-align: right;
        display: block;
        padding: 0.5rem 1.5rem; /* Corresponds to p-2 px-6 */
        border-bottom: 1px solid #444;
    }

    #mobile-menu .menu-item:last-child a {
        border-bottom: none;
    }

    #mobile-menu .menu-item a:hover {
        background-color: #222;
    }

    #mobile-menu .current-menu-item a {
        background-color: #cccccc;
        color: black;
        font-weight: bold;
    }
}

/* Site Title Multiline Styling */
.site-title-multiline {
    display: inline-block; /* Allows JS to accurately measure width */
}

.title-line-1, .title-line-2 {
    display: block; /* Ensures they stack vertically */
    white-space: nowrap; /* Prevents the lines themselves from wrapping */
}

.title-line-2 {
    transform: scaleY(0.8);
    transform-origin: top;
    text-align: justify;
    text-align-last: justify;
}

/* Add a pseudo-element to force justification on the last line */
.title-line-2::after {
    content: "";
    display: inline-block;
    width: 100%;
}

/* Nudge the title down ONLY when it's multiline for better visual centering */
.is-multiline {
    transform: translateY(4px);
}