/* Menu-Matic (Blue/Red) */
/* Based on Menu-Matic screenshot (DOS palette) */

body {
    background-color: #0000AA; /* Blue - DOS palette (68.96% of image) */
    color: #AAAAAA; /* Light Gray text - DOS palette */
}

/* Border colors for nested table structure */
.border-accent {
    border-color: #FFFFFF; /* White borders - DOS palette (1.79% of image) */
}

.menu-content {
    color: #AAAAAA; /* Light Gray text - DOS palette (4.11% of image) */
}

.menu-title {
    color: #FFFFFF; /* White text - DOS palette */
}

.menu-item {
    color: #AAAAAA; /* Light Gray menu text - DOS palette */
}

/* Hide brackets, show only number with red background */
.menu-item .num-bracket-open,
.menu-item .num-bracket-close {
    display: none;
}

.menu-item .num-value {
    background-color: #AA0000; /* Red background - DOS palette */
    color: #FFFFFF; /* White text - DOS palette */
    padding-left: 0.4em;
    padding-right: 0.4em;
}

/* Hidden spacer for alignment (IE3+ compatible) */
.menu-item .num-spacer {
    color: #0000AA; /* Match blue background to hide the space character */
}

/* Selective text highlighting - only highlight .menu-text span */
.menu-item .menu-text {
    color: #AAAAAA; /* Light Gray text - DOS palette */
}

.menu-item:hover .menu-text {
    background-color: #AAAAAA; /* Light Gray background on hover */
    color: #0000AA; /* Blue text on hover */
}

.menu-item.selected .menu-text {
    background-color: #AAAAAA; /* Light Gray background when selected */
    color: #0000AA; /* Blue text when selected */
}

.menu-help {
    background-color: #AAAAAA; /* Light Gray background - DOS palette */
    color: #0000AA; /* Blue text - DOS palette */
    font-weight: bold;
    margin-top: 10px; /* Space between menu box and footer */
}