/* For the file explorer, inspired by Norton Commander */

:root {
    --nc-bg: #42020d;
    --nc-text: #00ffb7;
    --nc-highlight-bg: #650414;
    --nc-highlight-text: #ffffff;
    --nc-statusbar: #00ffb7;
    --nc-highlight: #ffff00;
}

.nc-container {
    font-size: 1.6rem;
    background-color: var(--nc-bg);
    border: 3px double var(--nc-statusbar);
    max-width: 1000px;
    margin: 0 auto;
    box-shadow: 5px 5px 0px #000;
}

.nc-header, .nc-footer {
    background-color: var(--nc-statusbar);
    color: var(--nc-bg);
    padding: 5px 10px;
    font-weight: bold;
}

.nc-table {
    width: 100%;
    border-collapse: collapse;
    color: var(--nc-statusbar);
}

.nc-table th {
    color: var(--nc-highlight);
    border-bottom: 1px solid var(--nc-text);
    padding: 8px 5px;
}

.nc-table td {
    padding: 6px 5px;
    cursor: pointer;
}

/* Hover effect mimics selection cursor */
.nc-table tr:hover td {
    background-color: var(--nc-highlight-bg);
    color: var(--nc-highlight-text);
}

/* Alignments */
.col-icon { text-align: center; width: 40px; }
.col-name { text-align: left; width: auto; font-weight: bold; }
.col-size { text-align: center; width: 140px; }
.col-date { text-align: center; width: 120px; }
.col-time { text-align: center; width: 80px; }

/* SVG Icon Sizing */
.nc-icon {
    width: 24px;
    height: 24px;
    vertical-align: middle;
    padding-bottom: 4px;
}

.nc-table a {
    color: inherit;
    text-decoration: none;
    display: block;
    width: 100%;
}

.external-link {
    color: var(--nc-highlight);
}

/* --- NORTHERN OVERRIDES --- */
.nc-container a {
    color: inherit !important;
    text-decoration: none !important;
    background: none !important;
    border: none !important;
    outline: none !important;
    display: block;
    width: 100%;
}

.nc-container tr:hover td,
.nc-container tr:hover a {
    background-color: var(--nc-highlight-bg) !important;
    color: var(--nc-text) !important;
}

.nc-container a.external-link {
    color: var(--nc-highlight) !important;
}

.nc-container tr:hover a.external-link {
    color: var(--nc-highlight) !important;
}