/* ========================== */
   	   VIOLETTA 
    cybercore/laincore theme
	  1994 maidy
/* ========================= */



/* ---------- Global ---------- */

* {
    box-sizing: border-box;
}

html {
    width: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;

    background: #000 !important;
    overflow-x: hidden;
}

body {
    width: 100%;
    min-width: 0;
    min-height: 100vh;

    margin: 0;
    padding: 24px 32px;

    background: #000 !important;
    color: #aaa !important;

    font-family:
        "DejaVu Sans Mono",
        "Liberation Mono",
        "Courier New",
        monospace;

    font-size: 13px;
    line-height: 1.45;

    overflow-x: hidden;

    text-rendering: optimizeLegibility;
}


/* ---------- Main content ---------- */

h1,
table,
hr {
    width: 100%;
    max-width: 1100px;

    margin-left: auto;
    margin-right: auto;

    box-sizing: border-box;
}


/* ---------- Header ---------- */

h1 {
    margin-top: 0;
    margin-bottom: 18px;

    padding: 0 0 10px;

    color: #c0c0c0 !important;

    font-size: 15px;
    font-weight: normal;

    letter-spacing: 0.04em;

    border-bottom: 1px solid #181818;
}


/* ---------- Links ---------- */

a {
    color: #999 !important;

    text-decoration: none;

    transition:
        color 80ms linear,
        background-color 80ms linear;
}

a:hover {
    color: #e0e0e0 !important;
    text-decoration: none;
}


/* ---------- Table ---------- */

table {
    border-collapse: collapse;
    border-spacing: 0;

    background: #000 !important;

    table-layout: fixed;
}

table,
thead,
tbody,
tfoot,
tr,
th,
td {
    background-color: #000 !important;
}


/* ---------- Table header ---------- */

th {
    padding: 6px 8px;

    background-color: #080808 !important;

    color: #555 !important;

    font-size: 11px;
    font-weight: normal;

    text-align: left;

    border-top: 1px solid #181818;
    border-bottom: 1px solid #1b1b1b;
}


/* ---------- File rows ---------- */

td {
    padding: 6px 8px;

    background-color: #000 !important;
    color: #aaa !important;

    border-bottom: 1px solid #0e0e0e;
}

tr:hover td {
    background-color: #090909 !important;
    color: #d0d0d0 !important;
}


/* ---------- Columns ---------- */

th:first-child,
td:first-child {
    width: auto;
    min-width: 0;

    overflow-wrap: anywhere;
    word-break: break-word;
}

th:nth-child(2),
td:nth-child(2) {
    width: 110px;

    color: #555 !important;

    text-align: right;

    white-space: nowrap;
}

th:nth-child(3),
td:nth-child(3) {
    width: 170px;

    color: #555 !important;

    white-space: nowrap;
}


/* ---------- File links ---------- */

td a {
    color: #aaa !important;

    overflow-wrap: anywhere;
    word-break: break-word;
}

td a:hover {
    color: #fff !important;
}


/* ---------- Directories ---------- */

td a[href$="/"] {
    color: #aaa !important;
    font-weight: normal;
}

td a[href$="/"]::before {
    content: ">";

    display: inline-block;
    width: 14px;

    color: #333 !important;

    transition: color 80ms linear;
}

td a[href$="/"]:hover {
    color: #ddd !important;
}

td a[href$="/"]:hover::before {
    color: #888 !important;
}


/* ---------- Parent directory ---------- */

td a[href="../"] {
    color: #555 !important;
}

td a[href="../"]:hover {
    color: #aaa !important;
}


/* ---------- Separator ---------- */

hr {
    height: 1px;

    margin-top: 18px;
    margin-bottom: 18px;

    border: 0;

    background: #151515;
}


/* ---------- Selection ---------- */

::selection {
    background: #252525;
    color: #fff;
}


/* ---------- Scanlines ---------- */

body::after {
    content: "";

    position: fixed;
    inset: 0;

    z-index: 9999;

    width: 100vw;
    height: 100vh;

    margin: 0;
    padding: 0;

    pointer-events: none;

    background:
        repeating-linear-gradient(
            to bottom,
            rgba(255, 255, 255, 0.008) 0px,
            rgba(255, 255, 255, 0.008) 1px,
            transparent 1px,
            transparent 3px
        );
}
/* ---------- Scrollbar ---------- */

::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

::-webkit-scrollbar-track {
    background: #000;
}

::-webkit-scrollbar-thumb {
    background: #1c1c1c;
}

::-webkit-scrollbar-thumb:hover {
    background: #303030;
}


/* ---------- Mobile ---------- */

@media (max-width: 700px) {

    body {
        width: 100%;
        min-width: 0;

        padding: 14px 10px;
    }

    h1 {
        width: 100%;
        max-width: none;

        margin-top: 0;
        margin-bottom: 14px;

        font-size: 14px;
    }

    table {
        width: 100%;
        max-width: none;
        min-width: 0;

        table-layout: fixed;
    }

    th,
    td {
        min-width: 0;

        padding: 6px 5px;
    }

    th:first-child,
    td:first-child {
        width: auto;
        min-width: 0;

        overflow: hidden;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    th:nth-child(2),
    td:nth-child(2) {
        width: 68px;
        min-width: 68px;
        max-width: 68px;

        font-size: 10px;

        white-space: nowrap;
    }

    th:nth-child(3),
    td:nth-child(3) {
        width: 92px;
        min-width: 92px;
        max-width: 92px;

        font-size: 10px;

        white-space: nowrap;
    }

    td a {
        max-width: 100%;

        overflow-wrap: anywhere;
        word-break: break-word;
    }

    td a[href$="/"]::before {
        width: 10px;
    }

    ::-webkit-scrollbar:horizontal {
        display: none;
        height: 0;
    }
}


/* ---------- Small phones ---------- */

@media (max-width: 420px) {

    body {
        padding: 12px 8px;
    }

    h1 {
        font-size: 13px;
    }

    th,
    td {
        padding: 5px 4px;
    }

    th:nth-child(2),
    td:nth-child(2) {
        width: 58px;
        min-width: 58px;
        max-width: 58px;

        font-size: 9px;
    }

    th:nth-child(3),
    td:nth-child(3) {
        width: 82px;
        min-width: 82px;
        max-width: 82px;

        font-size: 9px;
    }
}