/* Web 1.0 Theme Stylesheet */

/* Disable all transitions for instant 90s response */
body.theme-web10,
body.theme-web10 * {
    transition: none !important;
}

body.theme-web10 {
    background-color: #c0c0c0 !important;
    /* Retro grid tiled background pattern in CSS */
    background-image: 
        linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.3) 1px, transparent 1px) !important;
    background-size: 20px 20px !important;
    color: #000000 !important;
    font-family: Courier, "Courier New", monospace !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
}

/* Remove image masks on tiles */
body.theme-web10 .tile,
body.theme-web10 .tile__image,
body.theme-web10 .image-grid-mask {
    mask-image: none !important;
    -webkit-mask-image: none !important;
    border-radius: 0 !important;
}

/* Headings in Comic Sans MS or Arial for peak Web 1.0 authenticity */
body.theme-web10 h1,
body.theme-web10 h2,
body.theme-web10 h3,
body.theme-web10 h4,
body.theme-web10 h5,
body.theme-web10 h6,
body.theme-web10 .site-title,
body.theme-web10 .logo {
    font-family: "Comic Sans MS", "Comic Sans", "Arial Black", sans-serif !important;
    color: #000080 !important; /* Classic Windows Navy */
    text-transform: none !important;
    letter-spacing: normal !important;
    font-weight: bold !important;
}

/* Blinking text helper */
@keyframes web10-blink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0; }
}

/* Emulated marquee for the header */
@keyframes web10-marquee {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}

/* Classic underlined links */
body.theme-web10 a {
    color: #0000ff !important;
    text-decoration: underline !important;
    font-weight: normal !important;
}

body.theme-web10 a:visited {
    color: #551a8b !important;
}

body.theme-web10 a:hover {
    color: #ff0000 !important;
    background-color: #ffff00 !important; /* Yellow highlight on hover */
}

/* Header & Nav styled with 90s folder tabs */
body.theme-web10 header,
body.theme-web10 .site-header {
    background-color: #c0c0c0 !important;
    border-bottom: 3px double #808080 !important;
    padding: 10px !important;
}

/* Rounded Folder Tabs for Navigation */
body.theme-web10 nav ul,
body.theme-web10 .nav-menu {
    display: flex !important;
    border-bottom: 2px solid #808080 !important;
    padding-left: 10px !important;
    margin-bottom: 15px !important;
    list-style: none !important;
}

body.theme-web10 nav li,
body.theme-web10 .nav-item {
    margin-bottom: -2px !important; /* overlap the border */
}

body.theme-web10 #primary-nav .primary-nav__link {
    display: block !important;
    background-color: #d8d8d8 !important;
    background-image: none !important; /* Reset glossy gradient */
    background: #d8d8d8 !important;
    border: 2px solid !important;
    border-color: #ffffff #5a5a5a #5a5a5a #ffffff !important; /* Windows 95 button bevel */
    border-bottom: none !important;
    border-radius: 0 !important; /* Reset rounded corners */
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
    padding: 6px 12px !important;
    margin-right: 4px !important;
    text-decoration: none !important;
    color: #000000 !important;
    font-weight: bold !important;
    font-size: 0.9rem !important;
    box-shadow: none !important; /* Reset glass shadow */
    backdrop-filter: none !important; /* Reset blur */
    -webkit-backdrop-filter: none !important;
    text-shadow: none !important;
    overflow: visible !important;
    transform: none !important;
}

body.theme-web10 #primary-nav .primary-nav__link::before,
body.theme-web10 #primary-nav .primary-nav__link::after {
    display: none !important; /* Remove sheen and gloss overlays */
}

body.theme-web10 #primary-nav .is-active .primary-nav__link,
body.theme-web10 #primary-nav .primary-nav__link:hover {
    background-color: #c0c0c0 !important;
    background-image: none !important;
    background: #c0c0c0 !important;
    border-bottom: 2px solid #c0c0c0 !important; /* blend into container */
    color: #0000ff !important;
    box-shadow: none !important;
    transform: none !important; /* Disable hover translation */
}

/* Disable parallax/voronoi backgrounds in header */
body.theme-web10 .site-header-bg:before,
body.theme-web10 .site-header-bg:after {
    display: none !important;
}

/* Retro Windows 95 Windows/Boxes/Tiles */
body.theme-web10 .tile,
body.theme-web10 .card,
body.theme-web10 .post-card,
body.theme-web10 article,
body.theme-web10 .content-box,
body.theme-web10 .wp-block-group {
    background-color: #c0c0c0 !important;
    background-image: none !important;
    color: #000000 !important;
    border: 2px solid !important;
    border-color: #ffffff #808080 #808080 #ffffff !important; /* Outset bevel */
    box-shadow: 1px 1px 0 0 #000000 !important;
    padding: 15px !important;
    margin-bottom: 20px !important;
    border-radius: 0 !important;
}

body.theme-web10 .tile *,
body.theme-web10 .tile p,
body.theme-web10 .tile h2,
body.theme-web10 .tile a,
body.theme-web10 .tile span,
body.theme-web10 .tile time {
    color: #000000 !important;
    background-color: transparent !important;
    background-image: none !important;
}



/* Input Fields & Selects */
body.theme-web10 input,
body.theme-web10 select,
body.theme-web10 textarea {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 2px solid !important;
    border-color: #808080 #ffffff #ffffff #808080 !important; /* Inset bevel */
    border-radius: 0 !important;
    padding: 4px !important;
    font-family: Courier, "Courier New", monospace !important;
}

/* Classic outset buttons */
body.theme-web10 button,
body.theme-web10 input[type="submit"],
body.theme-web10 .wp-block-button__link,
body.theme-web10 .btn {
    background-color: #c0c0c0 !important;
    color: #000000 !important;
    border: 2px solid !important;
    border-color: #ffffff #5a5a5a #5a5a5a #ffffff !important; /* Outset bevel */
    padding: 5px 15px !important;
    font-family: Courier, "Courier New", monospace !important;
    font-weight: bold !important;
    text-decoration: none !important;
    cursor: pointer !important;
    border-radius: 0 !important;
}

body.theme-web10 button:active,
body.theme-web10 input[type="submit"]:active,
body.theme-web10 .btn:active {
    border-color: #5a5a5a #ffffff #ffffff #5a5a5a !important; /* Inset bevel on click */
    padding: 6px 14px 4px 16px !important; /* push text slightly */
}

/* Add a blinker and construction ribbon at top of homepage */
body.theme-web10 .site-header::before {
    content: "🚧 UNDER CONSTRUCTION 🚧" !important;
    display: block !important;
    background: repeating-linear-gradient(
        -45deg,
        #f1c40f,
        #f1c40f 10px,
        #2c3e50 10px,
        #2c3e50 20px
    ) !important;
    color: #ffffff !important;
    text-shadow: 1px 1px 2px #000000 !important;
    text-align: center !important;
    font-family: Courier, "Courier New", monospace !important;
    font-weight: bold !important;
    padding: 8px !important;
    border: 2px solid #000000 !important;
    margin-bottom: 10px !important;
    animation: web10-blink 1.2s infinite !important;
}

/* Footer style */
body.theme-web10 footer,
body.theme-web10 .site-footer,
body.theme-web10 .site-footer__inner,
body.theme-web10 .site-footer * {
    background-color: #c0c0c0 !important;
    color: #000000 !important;
    text-align: center !important;
}

body.theme-web10 .site-footer__social a,
body.theme-web10 .site-footer__social svg {
    color: #000000 !important;
    fill: #000000 !important;
    background-color: transparent !important;
}

body.theme-web10 .back-to-top a .icon,
body.theme-web10 .back-to-top a span {
    stroke: #000000 !important;
    color: #000000 !important;
    background-color: transparent !important;
}

body.theme-web10 footer {
    border-top: 3px double #808080 !important;
    padding: 20px !important;
    display: block !important;
}

body.theme-web10 footer::after {
    content: "⚡ Powered by Netscape Navigator 4.0 & Internet Explorer 5.0" !important;
    display: block !important;
    margin-top: 15px !important;
    font-family: Courier, "Courier New", monospace !important;
    font-size: 0.75rem !important;
    color: #404040 !important;
}

/* Hero Titles in Comic Sans MS */
body.theme-web10 .hero__title,
body.theme-web10 .hero__title2 {
    font-family: "Comic Sans MS", "Comic Sans", "Arial Black", sans-serif !important;
}

body.theme-web10 .hero__title {
    color: #000000 !important;
}

body.theme-web10 .archive-header__title {
    
    color: #0FF000 !important;
}


/* Old style ticker tape for subhero */
body.theme-web10 .subhero {
    background-color: #000000 !important;
    border: 3px inset #808080 !important;
    padding: 6px 0 !important;
    overflow: hidden !important;
    margin-bottom: 20px !important;
}

body.theme-web10 .subhero .wrap {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

body.theme-web10 .subhero p {
    display: inline-block !important;
    margin: 0 !important;
    padding-left: 100% !important;
    white-space: nowrap !important;
    color: #00ff00 !important; /* Retro green ticker text */
    font-family: "Courier New", Courier, monospace !important;
    font-size: 1.4rem !important;
    font-weight: bold !important;
    animation: web10-ticker 20s linear infinite !important;
    text-shadow: 0 0 4px #00ff00 !important;
}

@keyframes web10-ticker {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-100%, 0, 0); }
}

/* Webring/Link Exchange style for site-footer__clients */
body.theme-web10 .site-footer__clients {
    background-color: #c0c0c0 !important;
    border-top: 3px double #808080 !important;
    padding: 20px 0 !important;
    text-align: center !important;
}

body.theme-web10 .site-footer__clients::before {
    content: "ーーー ✦ WEB MEMber RING / PARTNERS ✦ ーーー" !important;
    display: block !important;
    font-family: "Comic Sans MS", "Comic Sans", sans-serif !important;
    font-size: 0.95rem !important;
    font-weight: bold !important;
    color: #800000 !important; /* Retro Maroon red */
    margin-bottom: 15px !important;
    text-align: center !important;
}

body.theme-web10 .site-footer__clients .client-logos-group {
    gap: 20px !important;
    animation: scroll 40s linear infinite !important;
    opacity: 1 !important;
}

body.theme-web10 .site-footer__clients .client-logo {
    background-color: #ffffff !important;
    border: 2px solid !important;
    border-color: #ffffff #5a5a5a #5a5a5a #ffffff !important; /* Retro button bevel */
    padding: 3px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body.theme-web10 .site-footer__clients .client-logo img {
    filter: brightness(0) !important; /* Make white/colored logos black for contrast on white background */
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
    max-height: 31px !important;
    width: auto !important;
}

/* Now content and Stack section Courier typography */
body.theme-web10 .now-content,
body.theme-web10 .now-content *,
body.theme-web10 .stack-column,
body.theme-web10 .tool-tag {
    font-family: Courier, "Courier New", monospace !important;
}

/* Header logo override: invert to black on grey and disable hover */
body.theme-web10 .logo {
    background-color: transparent !important;
    transform: none !important;
    transition: none !important;
}

body.theme-web10 .logo:hover {
    transform: none !important;
}

body.theme-web10 .logo-path {
    fill: #000000 !important;
    stroke: none !important;
}

/* Remove yellow background highlight on hover for the logo link */
body.theme-web10 .site-navigation-wrapper > a:hover,
body.theme-web10 a:has(.logo):hover {
    background-color: transparent !important;
}

/* Remove hover effects on tiles */
body.theme-web10 .tile:hover,
body.theme-web10 .tile:has(h2 a:hover),
body.theme-web10 .tile.is-dark:has(h2 a:hover),
body.theme-web10 .tile.is-light:has(h2 a:hover) {
    transform: none !important;
    background-color: #c0c0c0 !important;
    box-shadow: 1px 1px 0 0 #000000 !important;
    border-color: #ffffff #808080 #808080 #ffffff !important;
    color: #000000 !important;
}

body.theme-web10 .tile a:hover,
body.theme-web10 .tile h2 a:hover,
body.theme-web10 .tile h2:hover,
body.theme-web10 .tile__text a:hover {
    color: #000000 !important;
    background-color: transparent !important;
    text-decoration: underline !important;
}

/* Old school animated search icon */
body.theme-web10 .search-toggle svg.icon-search {
    display: none !important;
}

body.theme-web10 .search-details {
    display: block !important;
    position: relative !important;
    z-index: 9999 !important;
}

body.theme-web10 .search-toggle {
    display: flex !important;
    position: relative !important;
    z-index: 9999 !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    background-image: url('data:image/gif;base64,R0lGODlhEAAQAPQAAP///wAAAPDw8IqKiuDg4ICAgFn/mf///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQJBgAACwAsAAAAABAAEAAABUagII5kaZ5oqq5s675wLM90bd94ru987//AoHBILBqPxKRyyWw6n9CodEqtWq/YrHbL7XrP57S6XF5P2C/Yy/V6v2A4BCH+QQJBgAACwAsAAAAABAAEAAABUegII5kaZ5oqq5s675wLM90bd94ru987//AoHBILBqPxKRyyWw6n9CodEqtWq/YrHbL7XrP57S6XF5P2C/Yy/V6v2A4BCH+QQJBgAACwAsAAAAABAAEAAABUigII5kaZ5oqq5s675wLM90bd94ru987//AoHBILBqPxKRyyWw6n9CodEqtWq/YrHbL7XrP57S6XF5P2C/Yy/V6v2A4BCH+QQJBgAACwAsAAAAABAAEAAABUmgII5kaZ5oqq5s675wLM90bd94ru987//AoHBILBqPxKRyyWw6n9CodEqtWq/YrHbL7XrP57S6XF5P2C/Yy/V6v2A4BCH5BAkGAAALACwAAAAAEAAQAAAFSqAgjmRpnmiqrmzrvnAsz3Rt33iu73zv/8CgcEgsGo/EpHLJbDqf0Kh0Sq1ar9isdsvtes/ntLpcXk/YL9jL9Xq/YDgEADs=') !important;
    background-size: 20px 20px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    cursor: pointer !important;
    list-style: none !important;
    padding: 0 !important;
    border: none !important;
}