/* ===================================================
   JSÍ Document Archive — Skráarsafn JSÍ
   Clean HTML, no plugin needed
   =================================================== */

/* Two-column grid layout */
.docs-archive {
    max-width: 1100px;
    margin: 0 auto;
}

.docs-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: start;
}

.docs-column {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

/* Category block */
.docs-category {
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
    background: var(--color-white);
}

.docs-category__title,
.entry-content .docs-category__title,
.entry-content h3.docs-category__title {
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #FFFFFF !important;
    background: var(--color-blue-dark);
    padding: .85rem 1.25rem;
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: .6rem;
}

.docs-category__title::before {
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,.6)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 19a2 2 0 01-2 2H4a2 2 0 01-2-2V5a2 2 0 012-2h5l2 3h9a2 2 0 012 2z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

.docs-category__desc {
    padding: .75rem 1.25rem 0;
    font-size: .85rem;
    color: var(--color-text-light);
    line-height: 1.5;
    margin: 0;
}

/* File list */
.docs-list,
.entry-content ul.docs-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.docs-list li,
.entry-content .docs-list li {
    border-top: 1px solid var(--color-gray-100);
    margin: 0 !important;
    list-style: none !important;
}

.docs-list li:first-child {
    border-top: none;
}

.docs-list a,
.entry-content .docs-list a {
    display: flex !important;
    align-items: center;
    gap: .85rem;
    padding: .75rem 1.25rem;
    font-size: .9rem;
    font-weight: 500;
    color: var(--color-text) !important;
    text-decoration: none !important;
    transition: all .15s ease;
    line-height: 1.35;
}

.docs-list a:hover,
.entry-content .docs-list a:hover {
    background: var(--color-gray-100);
    color: var(--color-red) !important;
    padding-left: 1.5rem;
}

/* Download icon on hover */
.docs-list a::after {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    margin-left: auto;
    flex-shrink: 0;
    opacity: 0;
    transition: opacity .15s ease;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23C8102E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4'/%3E%3Cpolyline points='7 10 12 15 17 10'/%3E%3Cline x1='12' y1='15' x2='12' y2='3'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

.docs-list a:hover::after {
    opacity: 1;
}

/* File type badge */
.docs-type {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 30px;
    padding: 0 .4rem;
    border-radius: 6px;
    font-size: .6rem;
    font-weight: 800;
    letter-spacing: .04em;
    flex-shrink: 0;
    text-transform: uppercase;
}

.docs-type[data-type="pdf"] {
    background: #FCEEED;
    color: #C8102E;
}

.docs-type[data-type="xls"],
.docs-type[data-type="xlsx"] {
    background: #E8F5E9;
    color: #2E7D32;
}

.docs-type[data-type="doc"],
.docs-type[data-type="docx"] {
    background: #E3F2FD;
    color: #1565C0;
}

.docs-type[data-type="zip"] {
    background: #FFF3E0;
    color: #E65100;
}

.docs-type[data-type="img"] {
    background: #F3E5F5;
    color: #6A1B9A;
}

/* ===================================================
   RESPONSIVE
   =================================================== */
@media (max-width: 768px) {
    .docs-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .docs-list a {
        padding: .7rem 1rem;
        font-size: .88rem;
    }

    .docs-list a::after {
        display: none;
    }
}

@media (max-width: 480px) {
    .docs-type {
        min-width: 32px;
        height: 26px;
        font-size: .55rem;
    }

    .docs-list a {
        gap: .6rem;
        font-size: .84rem;
    }
}

/* Hide leftover fivo-docs plugin output */
.fivo-docs,
.fivo-docs-none-found {
    display: none !important;
}