/* My Computer Window Styles */

#my-computer-window .window-body {
    background-color: var(--win98-white);
    padding: 2px;
}

.explorer-body {
    background-color: var(--win98-gray);
    padding: 1px;
}

/* Combined Toolbar/Address Bar Container */
.explorer-combined-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 2px 3px;
    background-color: var(--win98-gray);
    border-top: 1px solid var(--win98-white);
    border-bottom: 1px solid var(--win98-gray-dark);
}

/* Toolbar */
.explorer-toolbar {
    padding-right: 5px;
}

.explorer-toolbar button {
    display: inline-flex;
    align-items: center;
    height: 26px;
}

.explorer-toolbar button img {
    width: 16px;
    height: 16px;
    margin-right: 4px;
}

/* Address Bar */
.address-bar {
    flex-grow: 1;
    display: flex;
    align-items: center;
}

.address-bar label {
    margin-right: 5px;
}

.address-bar input {
    flex-grow: 1;
    font-family: var(--font-family);
}

/* Main Content Pane */
.main-pane {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    background-color: var(--win98-white);
    margin: 3px 3px 0 3px;
    padding: 5px;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    margin: 0;
}

/* Status Bar */
.status-bar {
    margin: 0;
    display: flex;
    background-color: var(--win98-gray);
}

/* File Icons */
.file-icon {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 80px;
    margin: 5px;
    text-align: center;
    padding: 5px;
    cursor: url('/assets/cursors/link.cur'), pointer;
}

.file-icon img {
    width: 32px;
    height: 32px;
    margin-bottom: 5px;
}

.file-icon span {
    word-break: break-all;
}

.file-icon:hover,
.file-icon.selected {
    background-color: var(--win98-blue);
    color: var(--win98-white);
}

/* File Explorer Container */
.file-explorer-container {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.file-item {
    display: flex;
    align-items: center;
    padding: 3px 5px;
    text-decoration: none;
    color: var(--win98-black);
}

.file-item img {
    width: 24px;
    height: 24px;
    margin-right: 8px;
}

.file-item:hover,
.file-item:focus {
    background-color: var(--win98-blue);
    color: var(--win98-white);
    outline: none;
}