/* Start Menu Styles */

.start-menu {
    position: absolute;
    bottom: var(--taskbar-height);
    left: 3px;
    width: var(--start-menu-width);
    background-color: var(--win98-gray);
    border-top: 2px solid var(--win98-white);
    border-left: 2px solid var(--win98-white);
    border-right: 2px solid var(--win98-black);
    border-bottom: 2px solid var(--win98-black);
    box-shadow: 1px 1px 0 var(--win98-black);
    display: none;
    z-index: var(--start-menu-z-index);
    padding: 2px;
    flex-direction: row;
}

/* Win98 Style Vertical Sidebar */
.start-menu-sidebar {
    width: var(--start-menu-sidebar-width);
    background: var(--win98-gray-dark);
    color: var(--win98-gray);
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
    text-align: center;
    padding: 10px 0;
    font-size: 24px;
    margin-right: 2px;
}

.start-menu-sidebar b {
    color: var(--win98-white);
}

/* Menu Items */
.start-menu-items {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

.start-menu-item {
    display: flex;
    align-items: center;
    padding: 5px;
    position: relative;
}

.start-menu-item:hover {
    background-color: var(--win98-blue);
    color: var(--win98-white);
}

.start-menu-item img {
    margin-right: 10px;
}

/* Menu Separator */
.separator {
    height: 1px;
    background-color: var(--win98-gray-dark);
    border-bottom: 1px solid var(--win98-white);
    margin: 4px 0;
}

/* Disabled Items */
.start-menu-item.disabled {
    color: var(--win98-gray-dark);
    text-shadow: 1px 1px var(--win98-white);
}

.start-menu-item.disabled:hover {
    background-color: transparent;
    color: var(--win98-gray-dark);
}

/* Submenu Indicator */
.start-menu-item.has-submenu > span {
    flex-grow: 1;
}

.start-menu-item.has-submenu::after {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 4px;
    border-color: transparent transparent transparent var(--win98-black);
    margin-right: 5px;
}

/* Submenu */
.submenu {
    position: absolute;
    display: none;
    left: 100%;
    top: -4px;
    width: 180px;
    list-style: none;
    margin: 0;
    padding: 2px;
    background-color: var(--win98-gray);
    border-top: 2px solid var(--win98-white);
    border-left: 2px solid var(--win98-white);
    border-right: 2px solid var(--win98-black);
    border-bottom: 2px solid var(--win98-black);
    box-shadow: 1px 1px 0 var(--win98-black);
    z-index: 22;
}

.start-menu-item:hover > .submenu {
    display: block;
}
