windows95.py

from __future__ import annotations

from collections.abc import Iterable

from gradio.themes.base import Base
from gradio.themes.utils import colors, fonts, sizes

# Custom CSS to style the Gradio footer as a Windows 95 taskbar
WINDOWS_95_CSS = """
/* Remove transforms from parent containers that break fixed positioning */
.gradio-container,
.gradio-container > *,
.main,
.wrap,
.app,
gradio-app,
gradio-app > *,
body > * {
    transform: none !important;
    filter: none !important;
    perspective: none !important;
    contain: none !important;
    will-change: auto !important;
}

/* Windows 95 Taskbar Footer */
footer {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    margin: 0 !important;
    padding: 4px 8px !important;
    background: #C0C0C0 !important;
    border-top: 2px solid #FFFFFF !important;
    box-shadow:
        inset 0 1px 0 0 #DFDFDF,
        inset 0 -1px 0 0 #808080,
        0 -1px 0 0 #404040 !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    z-index: 2147483647 !important;
    font-family: "MS Sans Serif", Tahoma, Arial, sans-serif !important;
    height: auto !important;
    min-height: 32px !important;
    transform: none !important;
    width: 100vw !important;
    max-width: 100vw !important;
}

/* Style footer buttons like Windows 95 taskbar buttons */
footer button,
footer a {
    background: #C0C0C0 !important;
    color: #000000 !important;
    border: none !important;
    padding: 4px 12px !important;
    margin: 0 2px !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #FFFFFF,
        inset -2px -2px 0px 0px #404040,
        inset 2px 2px 0px 0px #DFDFDF !important;
    font-family: "MS Sans Serif", Tahoma, Arial, sans-serif !important;
    font-size: 12px !important;
}

footer button:hover,
footer a:hover {
    color: #000000 !important;
}

footer button:active,
footer a:active {
    box-shadow:
        inset 1px 1px 0px 0px #808080,
        inset -1px -1px 0px 0px #DFDFDF !important;
}

/* Hide the dividers */
footer .divider {
    display: none !important;
}

/* Style the images/icons */
footer img {
    filter: none !important;
}

/* Add padding to main content to account for fixed footer */
.gradio-container {
    padding-bottom: 50px !important;
}

/* Ensure footer stays fixed even in flex/grid containers */
.main,
.wrap,
.app {
    padding-bottom: 50px !important;
}

/* Start button style for the first button (if desired) */
footer button:first-of-type,
footer a:first-of-type {
    font-weight: bold !important;
}

/* System tray style for the last elements - sunken appearance */
footer button:last-of-type,
footer .settings {
    margin-left: auto !important;
    box-shadow:
        inset 1px 1px 0px 0px #808080,
        inset -1px -1px 0px 0px #FFFFFF,
        inset 2px 2px 0px 0px #404040,
        inset -2px -2px 0px 0px #DFDFDF !important;
}

/* API docs panel styling - gray background like Windows 95 */
.api-docs-wrap,
#api-recorder-container {
    background: #C0C0C0 !important;
}

/* API name badges - navy background needs white text */
.post,
h3 .post,
span.post {
    background: #000080 !important;
    color: #FFFFFF !important;
    border-color: #000080 !important;
}

/* Parameter type badges in API docs - the highlight class */
.highlight,
span.highlight,
.code.highlight {
    background: #000080 !important;
    color: #FFFFFF !important;
    padding: 2px 6px !important;
}

/* Parameter type badges in API docs */
.type,
.param-type,
.parameter-type {
    color: #FFFFFF !important;
    background: #000080 !important;
    padding: 2px 6px !important;
}

/* Required/Optional badges */
span[class*="required"],
span[class*="optional"],
.required,
.optional {
    color: #FFFFFF !important;
}

/* ===== Windows 95 Copy Button ===== */
.copy-button,
button[class*="copy"],
[class*="copy-button"] {
    background: #C0C0C0 !important;
    color: #000000 !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 4px 12px !important;
    font-family: "MS Sans Serif", Tahoma, Arial, sans-serif !important;
    font-size: 12px !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #FFFFFF,
        inset -2px -2px 0px 0px #404040,
        inset 2px 2px 0px 0px #DFDFDF !important;
}

.copy-button:hover,
button[class*="copy"]:hover,
[class*="copy-button"]:hover {
    background: #C0C0C0 !important;
}

.copy-button:active,
button[class*="copy"]:active,
[class*="copy-button"]:active {
    box-shadow:
        inset 1px 1px 0px 0px #808080,
        inset -1px -1px 0px 0px #DFDFDF !important;
}

/* Copy button icons */
.copy-button svg,
button[class*="copy"] svg {
    color: #000000 !important;
    fill: #000000 !important;
}

/* The "Copy Page" dropdown button - be specific to avoid breaking footer */
.api-docs-wrap [class*="dropdown"] button,
.api-docs-wrap .dropdown-toggle,
.api-docs-wrap button[aria-haspopup="true"] {
    background: #C0C0C0 !important;
    color: #000000 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #FFFFFF,
        inset -2px -2px 0px 0px #404040,
        inset 2px 2px 0px 0px #DFDFDF !important;
}

/* ===== Windows 95 Dropdown Menus ===== */
[role="menu"],
[role="listbox"],
.dropdown-menu,
div[class*="dropdown"] > div,
ul[class*="menu"],
div[class*="menu"]:not(.overflow-menu) {
    background: #C0C0C0 !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 2px !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #FFFFFF,
        inset -2px -2px 0px 0px #404040,
        inset 2px 2px 0px 0px #DFDFDF,
        4px 4px 0px 0px rgba(0,0,0,0.3) !important;
}

/* Dropdown menu items */
[role="menu"] button,
[role="menu"] a,
[role="menuitem"],
.dropdown-menu button,
.dropdown-menu a,
div[class*="dropdown"] button,
div[class*="dropdown"] a {
    background: #C0C0C0 !important;
    color: #000000 !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 4px 24px 4px 8px !important;
    margin: 0 !important;
    box-shadow: none !important;
    text-align: left !important;
    display: block !important;
    width: 100% !important;
}

[role="menu"] button:hover,
[role="menu"] a:hover,
[role="menuitem"]:hover,
.dropdown-menu button:hover,
.dropdown-menu a:hover,
div[class*="dropdown"] button:hover,
div[class*="dropdown"] a:hover {
    background: #000080 !important;
    color: #FFFFFF !important;
}

/* Menu item descriptions/subtitles */
[role="menu"] span,
[role="menu"] p,
.dropdown-menu span,
.dropdown-menu p {
    color: inherit !important;
}

/* Menu icons */
[role="menu"] svg,
.dropdown-menu svg {
    color: inherit !important;
    fill: currentColor !important;
}

/* Any element using color-accent-soft as background needs white text */
[style*="color-accent-soft"],
[style*="accent"] {
    color: #FFFFFF !important;
}

/* Code blocks - keep readable with white background */
pre {
    background: #FFFFFF !important;
    color: #000000 !important;
    box-shadow: inset 1px 1px 0px 0px #808080,
                inset -1px -1px 0px 0px #FFFFFF,
                inset 2px 2px 0px 0px #404040,
                inset -2px -2px 0px 0px #DFDFDF !important;
}

pre code,
code {
    background: transparent !important;
    color: #000000 !important;
}

/* API name in code snippets - keep the accent color visible */
pre .api-name,
code .api-name {
    color: #000080 !important;
}

/* Highlighted text in code - navy background needs white text */
pre .highlight,
pre span.highlight,
code .highlight,
code span.highlight {
    background: #000080 !important;
    color: #FFFFFF !important;
}

/* String literals in code */
pre .token.string,
.token.string {
    color: #008000 !important;
}

/* Syntax highlighting keywords with navy background need white text */
pre span[style*="background"],
code span[style*="background"],
pre .keyword,
pre .builtin,
pre .function-name,
code .keyword,
code .builtin {
    color: #FFFFFF !important;
}

/* ===== Windows 95 Style Tabs ===== */
/* Remove gap between tabs and content */
.tabs {
    gap: 0 !important;
}

/* Tab container - remove the modern underline */
.tab-container::after {
    display: none !important;
}

.tab-wrapper {
    padding-bottom: 0 !important;
    margin-bottom: -2px !important;
    border-bottom: none !important;
    background: transparent !important;
    z-index: 1 !important;
    position: relative !important;
}

/* Individual tab buttons - raised 3D folder tab style */
.tab-container button,
.tabs button[role="tab"] {
    background: #C0C0C0 !important;
    color: #000000 !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 4px 16px !important;
    margin: 0 !important;
    margin-right: -1px !important;
    position: relative !important;
    bottom: -2px !important;
    font-weight: 400 !important;
    /* 3D raised effect for inactive tabs */
    box-shadow:
        inset 1px 1px 0px 0px #FFFFFF,
        inset -1px 0px 0px 0px #808080,
        inset 2px 2px 0px 0px #DFDFDF,
        inset -2px 0px 0px 0px #404040,
        0px -1px 0px 0px #FFFFFF !important;
    /* Clip the bottom to show connection */
    border-bottom: 2px solid #C0C0C0 !important;
}

/* Inactive tabs - slightly darker/recessed look */
.tab-container button:not(.selected),
.tabs button[role="tab"]:not(.selected) {
    background: #C0C0C0 !important;
    border-bottom: 2px solid #808080 !important;
    margin-bottom: 0 !important;
}

/* Hover state for non-selected tabs */
.tab-container button:hover:not(.selected),
.tabs button[role="tab"]:hover:not(.selected) {
    background: #C0C0C0 !important;
}

/* Selected tab - connected to content below */
.tab-container button.selected,
.tabs button[role="tab"].selected,
.tabs button[role="tab"][aria-selected="true"] {
    background: #C0C0C0 !important;
    color: #000000 !important;
    border-bottom: 2px solid #C0C0C0 !important;
    z-index: 2 !important;
    /* Full raised 3D effect */
    box-shadow:
        inset 1px 1px 0px 0px #FFFFFF,
        inset -1px 0px 0px 0px #808080,
        inset 2px 2px 0px 0px #DFDFDF,
        inset -2px 0px 0px 0px #404040 !important;
}

/* Remove the modern accent underline from selected tab */
.tab-container button.selected::after,
.tabs button[role="tab"].selected::after,
.tabs button[role="tab"][aria-selected="true"]::after {
    display: none !important;
}

/* Tab content panel */
.tabs > :not(.tab-wrapper):not(style) {
    background: #C0C0C0 !important;
    border: none !important;
    border-top: 2px solid #808080 !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 0px 0px 0px #FFFFFF,
        inset 0px 1px 0px 0px #FFFFFF,
        -2px -2px 0px 0px #404040,
        2px 2px 0px 0px #DFDFDF !important;
    padding: 8px !important;
    margin-top: 0 !important;
}

/* Overflow menu button */
.overflow-menu > button {
    background: #C0C0C0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #FFFFFF,
        inset -2px -2px 0px 0px #404040,
        inset 2px 2px 0px 0px #DFDFDF !important;
}

/* Overflow dropdown */
.overflow-dropdown {
    background: #C0C0C0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #FFFFFF,
        inset -2px -2px 0px 0px #404040,
        inset 2px 2px 0px 0px #DFDFDF,
        2px 2px 4px rgba(0,0,0,0.3) !important;
}

.overflow-dropdown button {
    background: #C0C0C0 !important;
    color: #000000 !important;
}

.overflow-dropdown button:hover {
    background: #000080 !important;
    color: #FFFFFF !important;
}

.overflow-dropdown button.selected {
    background: #000080 !important;
    color: #FFFFFF !important;
}

/* ===== Windows 95 Scrollbars ===== */
* {
    scrollbar-width: auto;
    scrollbar-color: #C0C0C0 #DFDFDF;
}

*::-webkit-scrollbar {
    width: 16px !important;
    height: 16px !important;
}

*::-webkit-scrollbar-track {
    background: #DFDFDF !important;
    background-image: url("data:image/svg+xml,%3Csvg width='2' height='2' viewBox='0 0 2 2' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h1v1H0zM1 1h1v1H1z' fill='%23C0C0C0'/%3E%3C/svg%3E") !important;
    background-size: 2px 2px !important;
}

*::-webkit-scrollbar-thumb {
    background: #C0C0C0 !important;
    border: none !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #FFFFFF,
        inset -2px -2px 0px 0px #404040,
        inset 2px 2px 0px 0px #DFDFDF !important;
}

*::-webkit-scrollbar-button {
    background: #C0C0C0 !important;
    border: none !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #FFFFFF,
        inset -2px -2px 0px 0px #404040,
        inset 2px 2px 0px 0px #DFDFDF !important;
    display: block !important;
    height: 16px !important;
    width: 16px !important;
}

/* ===== Windows 95 Tooltips ===== */
[data-tooltip],
[title],
.tooltip,
[role="tooltip"] {
    --tooltip-bg: #FFFFE1 !important;
    --tooltip-color: #000000 !important;
}

/* ===== Windows 95 Selection ===== */
::selection {
    background: #000080 !important;
    color: #FFFFFF !important;
}

::-moz-selection {
    background: #000080 !important;
    color: #FFFFFF !important;
}

/* ===== Windows 95 Focus Ring ===== */
*:focus {
    outline: 1px dotted #000000 !important;
    outline-offset: -4px !important;
}

button:focus,
input:focus,
textarea:focus,
select:focus {
    outline: 1px dotted #000000 !important;
    outline-offset: 2px !important;
}

/* ===== Windows 95 Disabled State ===== */
button:disabled,
input:disabled,
textarea:disabled,
select:disabled,
[disabled] {
    color: #808080 !important;
    text-shadow: 1px 1px 0px #FFFFFF !important;
    cursor: not-allowed !important;
}

/* ===== Windows 95 Progress Bar ===== */
progress,
.progress-bar,
[role="progressbar"] {
    background: #C0C0C0 !important;
    border: none !important;
    box-shadow:
        inset 1px 1px 0px 0px #808080,
        inset -1px -1px 0px 0px #FFFFFF,
        inset 2px 2px 0px 0px #404040,
        inset -2px -2px 0px 0px #DFDFDF !important;
    height: 20px !important;
    border-radius: 0 !important;
}

progress::-webkit-progress-bar {
    background: #C0C0C0 !important;
    border-radius: 0 !important;
}

progress::-webkit-progress-value {
    background: repeating-linear-gradient(
        90deg,
        #000080 0px,
        #000080 8px,
        #C0C0C0 8px,
        #C0C0C0 10px
    ) !important;
    border-radius: 0 !important;
}

progress::-moz-progress-bar {
    background: repeating-linear-gradient(
        90deg,
        #000080 0px,
        #000080 8px,
        #C0C0C0 8px,
        #C0C0C0 10px
    ) !important;
    border-radius: 0 !important;
}

/* ===== Windows 95 Accordion/Group Box ===== */
.accordion,
details,
fieldset,
.group {
    border: none !important;
    box-shadow:
        inset 1px 1px 0px 0px #FFFFFF,
        inset -1px -1px 0px 0px #808080 !important;
    background: #C0C0C0 !important;
    padding: 8px !important;
    margin: 4px 0 !important;
}

/* ===== Windows 95 Dropdown/Select ===== */
select,
.dropdown,
[role="listbox"] {
    background: #FFFFFF !important;
    border: none !important;
    box-shadow:
        inset 1px 1px 0px 0px #808080,
        inset -1px -1px 0px 0px #FFFFFF,
        inset 2px 2px 0px 0px #404040,
        inset -2px -2px 0px 0px #DFDFDF !important;
    border-radius: 0 !important;
    padding: 2px 4px !important;
}

/* ===== Windows 95 Slider/Range ===== */
input[type="range"] {
    -webkit-appearance: none !important;
    background: transparent !important;
    height: 24px !important;
}

input[type="range"]::-webkit-slider-track {
    background: #C0C0C0 !important;
    height: 4px !important;
    box-shadow:
        inset 1px 1px 0px 0px #808080,
        inset -1px -1px 0px 0px #FFFFFF !important;
}

input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    width: 12px !important;
    height: 20px !important;
    background: #C0C0C0 !important;
    border: none !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #FFFFFF,
        inset -2px -2px 0px 0px #404040,
        inset 2px 2px 0px 0px #DFDFDF !important;
    cursor: pointer !important;
    margin-top: -8px !important;
}

/* ===== Windows 95 Labels with Icons ===== */
.label-wrap label::before,
.block-label span::before {
    /* Could add a small icon here */
}

/* ===== Windows 95 Image/Media containers ===== */
.image-container,
.video-container,
.gallery {
    box-shadow:
        inset 1px 1px 0px 0px #808080,
        inset -1px -1px 0px 0px #FFFFFF,
        inset 2px 2px 0px 0px #404040,
        inset -2px -2px 0px 0px #DFDFDF !important;
}

/* Exclude small icons from bezel effect */
footer img,
button img,
a img,
svg {
    box-shadow: none !important;
}

/* ===== Windows 95 File Upload ===== */
.upload-container,
.file-upload,
[type="file"] {
    background: #C0C0C0 !important;
    border: 2px dashed #808080 !important;
    border-radius: 0 !important;
}

/* ===== Windows 95 Loading/Hourglass Cursor ===== */
.pending,
.loading,
[aria-busy="true"] {
    cursor: wait !important;
}

/* ===== Windows 95 Markdown/Prose ===== */
.prose h1,
.prose h2,
.prose h3,
.markdown h1,
.markdown h2,
.markdown h3,
h1, h2, h3 {
    color: #000000 !important;
    font-weight: bold !important;
    border-bottom: none !important;
}

/* ===== Windows 95 Horizontal Rule ===== */
hr {
    border: none !important;
    height: 2px !important;
    background: linear-gradient(to bottom, #808080 0%, #808080 50%, #FFFFFF 50%, #FFFFFF 100%) !important;
    margin: 8px 0 !important;
}

/* ===== Windows 95 Blockquote ===== */
blockquote {
    background: #FFFFFF !important;
    border-left: 4px solid #000080 !important;
    padding: 8px !important;
    margin: 8px 0 !important;
    box-shadow:
        inset 1px 1px 0px 0px #808080,
        inset -1px -1px 0px 0px #FFFFFF !important;
}

/* ===== Windows 95 Chatbot Messages ===== */
.message,
.chat-message,
[class*="message"] {
    border-radius: 0 !important;
}

.user-message,
[class*="user"] {
    background: #FFFFFF !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #DFDFDF !important;
}

.bot-message,
[class*="bot"],
[class*="assistant"] {
    background: #FFFFC0 !important;
    box-shadow:
        inset -1px -1px 0px 0px #808080,
        inset 1px 1px 0px 0px #DFDFDF !important;
}

/* ===== Windows 95 Loading Animation ===== */
@keyframes win95-loading {
    0% { background-position: 0% 0%; }
    100% { background-position: 100% 0%; }
}

.loading-indicator,
.loader {
    background: repeating-linear-gradient(
        90deg,
        #000080 0px,
        #000080 16px,
        transparent 16px,
        transparent 20px
    ) !important;
    background-size: 200% 100% !important;
    animation: win95-loading 1s linear infinite !important;
}
"""


class Windows95Gray(colors.Color):
    """Custom color palette matching Windows 95 system colors."""

    def __init__(self):
        super().__init__(
            c50="#FFFFFF",  # Window background / highlight
            c100="#DFDFDF",  # Light gray
            c200="#C0C0C0",  # Button face / 3D objects (classic silver)
            c300="#A0A0A0",  # Disabled text / inactive elements
            c400="#808080",  # Button shadow / 3D dark shadow
            c500="#606060",  # Dark elements
            c600="#404040",  # Darker elements
            c700="#303030",  # Very dark
            c800="#202020",  # Near black
            c900="#000000",  # Window text (black)
            c950="#000000",  # Pure black
            name="win95gray",
        )


class Windows95Blue(colors.Color):
    """Windows 95 navy blue for title bars and selections."""

    def __init__(self):
        super().__init__(
            c50="#E6E6FF",  # Lightest blue
            c100="#CCCCFF",  # Light blue
            c200="#9999FF",  # Medium light blue
            c300="#6666FF",  # Medium blue
            c400="#3333CC",  # Blue
            c500="#000080",  # Navy blue (active title bar)
            c600="#000066",  # Dark navy
            c700="#000055",  # Darker navy
            c800="#000044",  # Very dark navy
            c900="#000033",  # Nearly black navy
            c950="#000022",  # Darkest navy
            name="win95blue",
        )


class Windows95Teal(colors.Color):
    """Windows 95 teal accent color."""

    def __init__(self):
        super().__init__(
            c50="#E0FFFF",  # Lightest teal
            c100="#B0FFFF",  # Light teal
            c200="#80FFFF",  # Medium light teal
            c300="#40E0E0",  # Medium teal
            c400="#20C0C0",  # Teal
            c500="#008080",  # Classic teal (desktop default)
            c600="#006666",  # Dark teal
            c700="#005555",  # Darker teal
            c800="#004444",  # Very dark teal
            c900="#003333",  # Nearly black teal
            c950="#002222",  # Darkest teal
            name="win95teal",
        )


# Windows 95 3D border shadow effects
WIN95_SHADOW_RAISED = "inset -1px -1px 0px 0px #808080, inset 1px 1px 0px 0px #FFFFFF, inset -2px -2px 0px 0px #404040, inset 2px 2px 0px 0px #DFDFDF"
WIN95_SHADOW_SUNKEN = "inset 1px 1px 0px 0px #808080, inset -1px -1px 0px 0px #FFFFFF, inset 2px 2px 0px 0px #404040, inset -2px -2px 0px 0px #DFDFDF"
WIN95_SHADOW_PRESSED = "inset 1px 1px 0px 0px #808080, inset -1px -1px 0px 0px #DFDFDF"
WIN95_SHADOW_ETCHED = "inset 1px 1px 0px 0px #808080, inset -1px -1px 0px 0px #FFFFFF"


class Windows95(Base):
    """
    A nostalgic theme inspired by Microsoft Windows 95.

    Features the classic gray interface, 3D beveled buttons,
    sunken input fields, and the iconic system font styling.
    """

    def __init__(
        self,
        *,
        primary_hue: colors.Color | str = None,
        secondary_hue: colors.Color | str = None,
        neutral_hue: colors.Color | str = None,
        spacing_size: sizes.Size | str = sizes.spacing_md,
        radius_size: sizes.Size | str = sizes.radius_none,
        text_size: sizes.Size | str = sizes.text_md,
        font: fonts.Font | str | Iterable[fonts.Font | str] = (
            "MS Sans Serif",
            "Tahoma",
            "Segoe UI",
            "Arial",
            "sans-serif",
        ),
        font_mono: fonts.Font | str | Iterable[fonts.Font | str] = (
            "Fixedsys",
            "Consolas",
            "Courier New",
            "monospace",
        ),
    ):
        # Use our custom Windows 95 color palettes
        if primary_hue is None:
            primary_hue = Windows95Blue()
        if secondary_hue is None:
            secondary_hue = Windows95Teal()
        if neutral_hue is None:
            neutral_hue = Windows95Gray()

        super().__init__(
            primary_hue=primary_hue,
            secondary_hue=secondary_hue,
            neutral_hue=neutral_hue,
            spacing_size=spacing_size,
            radius_size=radius_size,
            text_size=text_size,
            font=font,
            font_mono=font_mono
        )

        self.name = "windows95"

        super().set(
            # ===== Body / Background =====
            # Classic gray desktop background
            body_background_fill="#008080",  # Teal desktop
            body_background_fill_dark="#008080",
            body_text_color="#000000",
            body_text_color_dark="#000000",
            body_text_color_subdued="#808080",
            body_text_color_subdued_dark="#808080",
            body_text_weight="400",
            # ===== Core Element Colors =====
            # Window/panel backgrounds
            background_fill_primary="#C0C0C0",  # Silver gray
            background_fill_primary_dark="#C0C0C0",
            background_fill_secondary="#C0C0C0",
            background_fill_secondary_dark="#C0C0C0",
            # Border colors
            border_color_primary="#808080",
            border_color_primary_dark="#808080",
            border_color_accent="#000080",  # Navy blue accent
            border_color_accent_dark="#000080",
            # Accent colors (selection, highlights)
            color_accent="#000080",  # Navy blue
            color_accent_soft="#000080",  # Navy blue for badges/tags
            color_accent_soft_dark="#000080",
            # ===== Links =====
            link_text_color="#0000FF",  # Classic blue links
            link_text_color_dark="#0000FF",
            link_text_color_hover="#0000FF",
            link_text_color_hover_dark="#0000FF",
            link_text_color_active="#800080",  # Purple when active
            link_text_color_active_dark="#800080",
            link_text_color_visited="#800080",  # Purple visited
            link_text_color_visited_dark="#800080",
            # ===== Text Styling =====
            prose_text_size="*text_md",
            prose_text_weight="400",
            prose_header_text_weight="700",
            code_background_fill="#FFFFFF",
            code_background_fill_dark="#FFFFFF",
            # ===== Shadows (3D Beveled Effects) =====
            shadow_drop="none",
            shadow_drop_lg="none",
            shadow_inset=WIN95_SHADOW_SUNKEN,
            shadow_spread="0px",
            shadow_spread_dark="0px",
            # ===== Block/Container Styling =====
            # Main content blocks with raised 3D effect
            block_background_fill="#C0C0C0",
            block_background_fill_dark="#C0C0C0",
            block_border_color="#808080",
            block_border_color_dark="#808080",
            block_border_width="2px",
            block_border_width_dark="2px",
            block_padding="*spacing_md",
            block_radius="0px",
            block_shadow=WIN95_SHADOW_RAISED,
            block_shadow_dark=WIN95_SHADOW_RAISED,
            # Block labels (like window title bars)
            block_label_background_fill="#000080",  # Navy title bar
            block_label_background_fill_dark="#000080",
            block_label_text_color="#FFFFFF",  # White text on title bar
            block_label_text_color_dark="#FFFFFF",
            block_label_border_color="#000080",
            block_label_border_color_dark="#000080",
            block_label_border_width="0px",
            block_label_border_width_dark="0px",
            block_label_padding="*spacing_xs *spacing_sm",
            block_label_margin="0",
            block_label_radius="0px",
            block_label_text_size="*text_sm",
            block_label_text_weight="700",
            block_label_shadow="none",
            block_label_right_radius="0px",
            # Block titles
            block_title_background_fill="transparent",
            block_title_background_fill_dark="transparent",
            block_title_text_color="#000000",
            block_title_text_color_dark="#000000",
            block_title_border_color="transparent",
            block_title_border_color_dark="transparent",
            block_title_border_width="0px",
            block_title_border_width_dark="0px",
            block_title_padding="*spacing_xs 0",
            block_title_radius="0px",
            block_title_text_size="*text_sm",
            block_title_text_weight="700",
            # Block info
            block_info_text_color="#000000",
            block_info_text_color_dark="#000000",
            block_info_text_size="*text_sm",
            block_info_text_weight="400",
            # ===== Panel Styling =====
            panel_background_fill="#C0C0C0",
            panel_background_fill_dark="#C0C0C0",
            panel_border_color="#808080",
            panel_border_color_dark="#808080",
            panel_border_width="2px",
            panel_border_width_dark="2px",
            # ===== Layout =====
            container_radius="0px",
            form_gap_width="1px",
            layout_gap="*spacing_md",
            section_header_text_size="*text_md",
            section_header_text_weight="700",
            embed_radius="0px",
            # ===== Input Fields (Sunken 3D Effect) =====
            input_background_fill="#FFFFFF",  # White input fields
            input_background_fill_dark="#FFFFFF",
            input_background_fill_focus="#FFFFFF",
            input_background_fill_focus_dark="#FFFFFF",
            input_background_fill_hover="#FFFFFF",
            input_background_fill_hover_dark="#FFFFFF",
            input_border_color="#808080",
            input_border_color_dark="#808080",
            input_border_color_focus="#000080",  # Navy when focused
            input_border_color_focus_dark="#000080",
            input_border_color_hover="#808080",
            input_border_color_hover_dark="#808080",
            input_border_width="2px",
            input_border_width_dark="2px",
            input_padding="*spacing_sm",
            input_radius="0px",
            input_shadow=WIN95_SHADOW_SUNKEN,
            input_shadow_dark=WIN95_SHADOW_SUNKEN,
            input_shadow_focus=WIN95_SHADOW_SUNKEN,
            input_shadow_focus_dark=WIN95_SHADOW_SUNKEN,
            input_text_size="*text_md",
            input_text_weight="400",
            input_placeholder_color="#808080",
            input_placeholder_color_dark="#808080",
            # ===== Buttons (Raised 3D Effect) =====
            button_border_width="2px",
            button_border_width_dark="2px",
            button_transition="none",
            button_transform_hover="none",
            button_transform_active="none",
            # Large buttons
            button_large_padding="*spacing_sm *spacing_lg",
            button_large_radius="0px",
            button_large_text_size="*text_md",
            button_large_text_weight="400",
            # Medium buttons
            button_medium_padding="*spacing_xs *spacing_md",
            button_medium_radius="0px",
            button_medium_text_size="*text_md",
            button_medium_text_weight="400",
            # Small buttons
            button_small_padding="*spacing_xs *spacing_sm",
            button_small_radius="0px",
            button_small_text_size="*text_sm",
            button_small_text_weight="400",
            # Primary button (like OK button)
            button_primary_background_fill="#C0C0C0",
            button_primary_background_fill_dark="#C0C0C0",
            button_primary_background_fill_hover="#C0C0C0",
            button_primary_background_fill_hover_dark="#C0C0C0",
            button_primary_border_color="#000000",
            button_primary_border_color_dark="#000000",
            button_primary_border_color_hover="#000000",
            button_primary_border_color_hover_dark="#000000",
            button_primary_text_color="#000000",
            button_primary_text_color_dark="#000000",
            button_primary_text_color_hover="#000000",
            button_primary_text_color_hover_dark="#000000",
            button_primary_shadow=WIN95_SHADOW_RAISED,
            button_primary_shadow_dark=WIN95_SHADOW_RAISED,
            button_primary_shadow_hover=WIN95_SHADOW_RAISED,
            button_primary_shadow_hover_dark=WIN95_SHADOW_RAISED,
            button_primary_shadow_active=WIN95_SHADOW_PRESSED,
            button_primary_shadow_active_dark=WIN95_SHADOW_PRESSED,
            # Secondary button
            button_secondary_background_fill="#C0C0C0",
            button_secondary_background_fill_dark="#C0C0C0",
            button_secondary_background_fill_hover="#C0C0C0",
            button_secondary_background_fill_hover_dark="#C0C0C0",
            button_secondary_border_color="#808080",
            button_secondary_border_color_dark="#808080",
            button_secondary_border_color_hover="#808080",
            button_secondary_border_color_hover_dark="#808080",
            button_secondary_text_color="#000000",
            button_secondary_text_color_dark="#000000",
            button_secondary_text_color_hover="#000000",
            button_secondary_text_color_hover_dark="#000000",
            button_secondary_shadow=WIN95_SHADOW_RAISED,
            button_secondary_shadow_dark=WIN95_SHADOW_RAISED,
            button_secondary_shadow_hover=WIN95_SHADOW_RAISED,
            button_secondary_shadow_hover_dark=WIN95_SHADOW_RAISED,
            button_secondary_shadow_active=WIN95_SHADOW_PRESSED,
            button_secondary_shadow_active_dark=WIN95_SHADOW_PRESSED,
            # Cancel button
            button_cancel_background_fill="#C0C0C0",
            button_cancel_background_fill_dark="#C0C0C0",
            button_cancel_background_fill_hover="#C0C0C0",
            button_cancel_background_fill_hover_dark="#C0C0C0",
            button_cancel_border_color="#808080",
            button_cancel_border_color_dark="#808080",
            button_cancel_border_color_hover="#808080",
            button_cancel_border_color_hover_dark="#808080",
            button_cancel_text_color="#000000",
            button_cancel_text_color_dark="#000000",
            button_cancel_text_color_hover="#000000",
            button_cancel_text_color_hover_dark="#000000",
            button_cancel_shadow=WIN95_SHADOW_RAISED,
            button_cancel_shadow_dark=WIN95_SHADOW_RAISED,
            button_cancel_shadow_hover=WIN95_SHADOW_RAISED,
            button_cancel_shadow_hover_dark=WIN95_SHADOW_RAISED,
            button_cancel_shadow_active=WIN95_SHADOW_PRESSED,
            button_cancel_shadow_active_dark=WIN95_SHADOW_PRESSED,
            # ===== Checkboxes and Radio Buttons =====
            checkbox_background_color="#FFFFFF",
            checkbox_background_color_dark="#FFFFFF",
            checkbox_background_color_focus="#FFFFFF",
            checkbox_background_color_focus_dark="#FFFFFF",
            checkbox_background_color_hover="#FFFFFF",
            checkbox_background_color_hover_dark="#FFFFFF",
            checkbox_background_color_selected="#FFFFFF",
            checkbox_background_color_selected_dark="#FFFFFF",
            checkbox_border_color="#808080",
            checkbox_border_color_dark="#808080",
            checkbox_border_color_focus="#000080",
            checkbox_border_color_focus_dark="#000080",
            checkbox_border_color_hover="#808080",
            checkbox_border_color_hover_dark="#808080",
            checkbox_border_color_selected="#808080",
            checkbox_border_color_selected_dark="#808080",
            checkbox_border_radius="0px",
            checkbox_border_width="2px",
            checkbox_border_width_dark="2px",
            checkbox_shadow=WIN95_SHADOW_SUNKEN,
            # Checkbox check mark (black check)
            checkbox_check="url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='black' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e\")",
            # Radio button circle (black dot)
            radio_circle="url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='black' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='4'/%3e%3c/svg%3e\")",
            # Checkbox labels (button-like appearance)
            checkbox_label_background_fill="#C0C0C0",
            checkbox_label_background_fill_dark="#C0C0C0",
            checkbox_label_background_fill_hover="#C0C0C0",
            checkbox_label_background_fill_hover_dark="#C0C0C0",
            checkbox_label_background_fill_selected="#000080",  # Navy when selected
            checkbox_label_background_fill_selected_dark="#000080",
            checkbox_label_border_color="#808080",
            checkbox_label_border_color_dark="#808080",
            checkbox_label_border_color_hover="#808080",
            checkbox_label_border_color_hover_dark="#808080",
            checkbox_label_border_color_selected="#000080",
            checkbox_label_border_color_selected_dark="#000080",
            checkbox_label_border_width="2px",
            checkbox_label_border_width_dark="2px",
            checkbox_label_padding="*spacing_xs *spacing_sm",
            checkbox_label_gap="*spacing_sm",
            checkbox_label_shadow=WIN95_SHADOW_RAISED,
            checkbox_label_text_size="*text_md",
            checkbox_label_text_weight="400",
            checkbox_label_text_color="#000000",
            checkbox_label_text_color_dark="#000000",
            checkbox_label_text_color_selected="#FFFFFF",  # White on navy
            checkbox_label_text_color_selected_dark="#FFFFFF",
            # ===== Tables =====
            table_border_color="#808080",
            table_border_color_dark="#808080",
            table_even_background_fill="#FFFFFF",
            table_even_background_fill_dark="#FFFFFF",
            table_odd_background_fill="#C0C0C0",
            table_odd_background_fill_dark="#C0C0C0",
            table_radius="0px",
            table_row_focus="#000080",
            table_row_focus_dark="#000080",
            table_text_color="#000000",
            table_text_color_dark="#000000",
            # ===== Accordion =====
            accordion_text_color="#000000",
            accordion_text_color_dark="#000000",
            # ===== Slider =====
            slider_color="#000080",  # Navy slider
            slider_color_dark="#000080",
            # ===== Loader =====
            loader_color="#000080",  # Navy loading indicator
            loader_color_dark="#000080",
            # ===== Chatbot =====
            chatbot_text_size="*text_md",
            # ===== Errors =====
            error_background_fill="#FFFFFF",
            error_background_fill_dark="#FFFFFF",
            error_border_color="#FF0000",  # Red error border
            error_border_color_dark="#FF0000",
            error_border_width="2px",
            error_border_width_dark="2px",
            error_text_color="#FF0000",  # Red error text
            error_text_color_dark="#FF0000",
            error_icon_color="#FF0000",
            error_icon_color_dark="#FF0000",
            # ===== Stats =====
            stat_background_fill="#000080",  # Navy stat bars
            stat_background_fill_dark="#000080",
        )