/* ***********************************************************************
 *
 *  File:   index.css
 *
 *  Descr:  Styles for the main page of the documents section.
 *
 *  Author: Jomar Hønsi, 2011-2026
 *
 * ************************************************************************/
a, a.visited {
    text-decoration: none;
    color: rgb(90, 184, 213);
}

a:hover {
    text-decoration: underline;
}

img#hasek {
    float: right;
    margin: 0 0 10px 10px;
    border-radius: 5px;
}

table.index {
    margin: 24px 0 6px;
    border: 0;
    border-collapse: separate;
    background-color: rgb(235, 235, 219);
    box-shadow: inset 0 0 10px #999;
    table-layout: fixed;
    clear: right;

    & th,
    & td {
        box-sizing: border-box;
    }

    & th {
        position: sticky;
        top: 0;
        z-index: 1;
        background-color: #dddcb6;
        color: #366;
        padding: 10px 12px;
        border-bottom: 1px solid #aa9;
        font-size: 0.7em;
        letter-spacing: 0;
        text-align: left;
        text-transform: uppercase;
    }

    & td {
        background-color: #eed;
        padding: 9px 12px;
        border-bottom: 1px solid #d8d5ad;
        font-size: 0.82em;
        line-height: 1.35;
        overflow-wrap: anywhere;
        vertical-align: top;
    }

    & th:first-child,
    & td:first-child {
        width: 39%;
    }

    & th:nth-child(2),
    & td:nth-child(2) {
        width: 22%;
    }

    & th:nth-child(3),
    & td:nth-child(3) {
        width: 25%;
    }

    & th:last-child,
    & td:last-child {
        width: 14%;
        text-align: center;
    }

    & tr:nth-child(odd) td {
        background-color: #e8e8c8;
    }

    & tr:hover td {
        background-color: #f3f1d2;
    }

    & tr:last-child td {
        border-bottom: 0;
    }

    & a {
        color: #33a;
        text-decoration-thickness: 1px;
        text-underline-offset: 3px;
    }

    & a:hover {
        color: #366;
    }

    & img {
        display: inline-block;
        vertical-align: middle;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
    }
}

@media (max-width: 560px) {
    table.index {
        display: block;
        overflow-x: auto;
        table-layout: auto;

        & th:first-child,
        & td:first-child {
            min-width: 240px;
        }

        & th:nth-child(2),
        & td:nth-child(2) {
            min-width: 145px;
        }

        & th:nth-child(3),
        & td:nth-child(3) {
            min-width: 180px;
        }

        & th:last-child,
        & td:last-child {
            min-width: 76px;
        }
    }
}