/* =========================================================
   HISTORISK DATA
========================================================= */

.history{
    display:flex;
    flex-direction:column;
    gap:var(--space-4);

    min-width:0;
}

/* ---------------------------------------------------------
   DATASÆT
--------------------------------------------------------- */

.history__datasets{
    display:grid;
    grid-template-columns:repeat(
        auto-fit,
        minmax(320px, 1fr)
    );
    gap:var(--space-3);
}

.history__dataset{
    display:flex;
    flex-direction:column;
    gap:var(--space-3);

    padding:var(--space-4);

    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-md);
    box-shadow:var(--shadow-sm);

    border-top:3px solid var(--color-primary);
}

.history__dataset.is-pending{
    border-top-color:var(--color-border);
    background:#FCFCFD;
}

.history__dataset header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:var(--space-3);
}

.history__dataset header strong{
    display:block;
    font-size:1rem;
}

.history__dataset header p{
    margin:var(--space-1) 0 0;

    font-size:.85rem;
    color:var(--color-text-muted);
}

.history__pending-note{
    margin:0;

    font-size:.85rem;
    color:var(--color-text-muted);
    font-style:italic;
}

.history__stats{
    display:grid;
    grid-template-columns:repeat(
        auto-fit,
        minmax(90px, 1fr)
    );
    gap:var(--space-3);

    margin:0;
}

.history__stats div{
    display:flex;
    flex-direction:column;
    gap:2px;
}

.history__stats dt{
    font-size:.72rem;
    font-weight:600;
    letter-spacing:.04em;
    text-transform:uppercase;

    color:var(--color-text-muted);
}

.history__stats dd{
    margin:0;

    font-size:1.05rem;
    font-weight:700;
    color:var(--color-text);
}

/* ---------------------------------------------------------
   FANER
--------------------------------------------------------- */

.history__tabs{
    display:flex;
    gap:var(--space-1);

    border-bottom:1px solid var(--color-border);
}

.history__tab{
    display:inline-flex;
    align-items:center;
    gap:var(--space-2);

    padding:10px 16px;

    background:transparent;
    border:none;
    border-bottom:2px solid transparent;

    color:var(--color-text-muted);
    font-weight:600;
    font-size:.95rem;

    cursor:pointer;
    transition:var(--transition-fast);
}

.history__tab:hover{
    color:var(--color-text);
}

.history__tab.is-active{
    color:var(--color-primary);
    border-bottom-color:var(--color-primary);
}

.history__tab-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-width:22px;
    padding:1px 6px;

    background:var(--color-border);
    border-radius:999px;

    font-size:.76rem;
    color:var(--color-text);
}

/* ---------------------------------------------------------
   PANEL
--------------------------------------------------------- */

.history__panel{
    display:flex;
    flex-direction:column;
    gap:var(--space-3);

    min-width:0;
}

.history__loading,
.history__error,
.history__empty{
    padding:var(--space-6);

    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-md);

    text-align:center;
    color:var(--color-text-muted);
}

.history__error{
    border-color:#FECACA;
    background:#FEF2F2;
    color:#991B1B;
}

.history__hint{
    margin:0;

    padding:var(--space-3) var(--space-4);

    background:#EFF6FF;
    border:1px solid #BFDBFE;
    border-radius:var(--radius-sm);

    font-size:.88rem;
    color:#1E40AF;
}

/* ---------------------------------------------------------
   TABEL
--------------------------------------------------------- */

.history__table-wrapper{
    width:100%;
    overflow-x:auto;

    background:var(--color-surface);
    border:1px solid var(--color-border);
    border-radius:var(--radius-md);
    box-shadow:var(--shadow-sm);
}

.history__table{
    width:100%;
    border-collapse:collapse;

    font-size:.9rem;
}

.history__table thead th{
    padding:10px var(--space-3);

    background:#F9FAFB;
    border-bottom:1px solid var(--color-border);

    text-align:left;
    font-size:.74rem;
    font-weight:600;
    letter-spacing:.04em;
    text-transform:uppercase;

    color:var(--color-text-muted);
    white-space:nowrap;
}

.history__table tbody td{
    padding:10px var(--space-3);

    border-bottom:1px solid var(--color-border);

    vertical-align:middle;
}

.history__table tbody tr:last-child td{
    border-bottom:none;
}

.history__table tbody tr:hover{
    background:#F9FAFB;
}

.history__table tbody tr.is-missing{
    background:#FFFBEB;
}

.history__row-actions{
    text-align:right;
    white-space:nowrap;
}

.history__link{
    padding:0;

    background:none;
    border:none;

    color:var(--color-primary);
    font:inherit;
    font-weight:600;

    cursor:pointer;
    text-decoration:underline;
}

.history__missing{
    color:var(--color-danger);
    font-style:italic;
}

/* ---------------------------------------------------------
   MÆRKATER
--------------------------------------------------------- */

.history__pill{
    display:inline-flex;
    align-items:center;

    padding:3px 10px;

    background:var(--color-border);
    border-radius:999px;

    font-size:.76rem;
    font-weight:600;
    white-space:nowrap;

    color:var(--color-text);
}

.history__pill.is-good{
    background:#DCFCE7;
    color:#166534;
}

.history__pill.is-warning{
    background:#FEF3C7;
    color:#92400E;
}

.history__pill.is-critical{
    background:#FEE2E2;
    color:#991B1B;
}

.history__pill.is-muted{
    background:#F3F4F6;
    color:var(--color-text-muted);
}

/* ---------------------------------------------------------
   MODAL
--------------------------------------------------------- */

.history__modal-backdrop{
    position:fixed;
    inset:0;
    z-index:1000;

    display:flex;
    align-items:center;
    justify-content:center;

    background:rgba(15,23,42,.45);
}

.history__modal{
    width:min(620px, calc(100vw - 32px));

    padding:var(--space-4);

    background:var(--color-surface);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-lg);
}

.history__modal.is-wide{
    width:min(920px, calc(100vw - 32px));
}

.history__modal .modal-header{
    display:flex;
    align-items:center;
    justify-content:space-between;

    margin-bottom:var(--space-3);
}

.history__modal .modal-header h3{
    margin:0;
    font-size:1.05rem;
}

.history__modal-body{
    display:flex;
    flex-direction:column;
    gap:var(--space-3);

    max-height:min(62vh, 640px);
    overflow-y:auto;
}

.history__modal-body label{
    display:block;

    margin-top:var(--space-2);
    margin-bottom:var(--space-1);

    font-size:.85rem;
    font-weight:600;
    color:var(--color-text-muted);
}

.history__modal-body .input{
    width:100%;

    padding:10px 12px;

    border:1px solid var(--color-border);
    border-radius:var(--radius-sm);

    font:inherit;
}

.history__modal .modal-actions{
    display:flex;
    justify-content:flex-end;
    gap:var(--space-2);

    margin-top:var(--space-4);
}

/* ---------------------------------------------------------
   GENNEMSYN
--------------------------------------------------------- */

.history__preview-summary{
    display:grid;
    grid-template-columns:repeat(
        auto-fit,
        minmax(140px, 1fr)
    );
    gap:var(--space-2);
}

.history__preview-stat{
    display:flex;
    flex-direction:column;
    gap:2px;

    padding:var(--space-3);

    background:#F9FAFB;
    border:1px solid var(--color-border);
    border-radius:var(--radius-sm);
}

.history__preview-stat.is-warning{
    background:#FFFBEB;
    border-color:#FDE68A;
}

.history__preview-stat span{
    font-size:.74rem;
    font-weight:600;
    letter-spacing:.04em;
    text-transform:uppercase;

    color:var(--color-text-muted);
}

.history__preview-stat strong{
    font-size:1rem;
}

.history__preview-mapping ul{
    display:flex;
    flex-wrap:wrap;
    gap:var(--space-2) var(--space-4);

    margin:var(--space-2) 0 0;
    padding:0;

    list-style:none;

    font-size:.86rem;
}

.history__preview-mapping code{
    padding:1px 6px;

    background:#F3F4F6;
    border-radius:4px;

    font-size:.82rem;
}

.history__preview-unmatched{
    padding:var(--space-3);

    background:#FFFBEB;
    border:1px solid #FDE68A;
    border-radius:var(--radius-sm);
}

.history__preview-unmatched p{
    margin:var(--space-1) 0 var(--space-2);
    font-size:.85rem;
}

.history__map-row{
    display:grid;
    grid-template-columns:1fr 240px;
    align-items:center;
    gap:var(--space-3);

    padding:var(--space-1) 0;
}

.history__map-row label{
    display:flex;
    flex-direction:column;
    gap:4px;

    margin:0;
}

.history__preview-unmatched label{
    display:block;

    margin-top:var(--space-2);
    margin-bottom:var(--space-1);

    font-size:.85rem;
    font-weight:600;
    color:#92400E;
}

.history__preview-unmatched .input{
    width:100%;

    padding:8px 10px;

    border:1px solid #FDE68A;
    border-radius:var(--radius-sm);

    background:var(--color-surface);
    font:inherit;
}

.history__map-row em{
    display:block;
    font-style:normal;
    font-size:.78rem;
}

.history__preview-issues{
    padding:var(--space-3);

    background:#F9FAFB;
    border:1px solid var(--color-border);
    border-radius:var(--radius-sm);

    font-size:.86rem;
}

.history__preview-issues ul{
    margin:var(--space-2) 0 0;
    padding-left:18px;
}

.history__preview-sample .history__table-wrapper{
    margin-top:var(--space-2);
    box-shadow:none;
}

.history__preview-sample .history__table{
    font-size:.82rem;
}


.history__preview-sign{
    padding:var(--space-3);

    background:#EFF6FF;
    border:1px solid #BFDBFE;
    border-radius:var(--radius-sm);
}

.history__preview-sign strong{
    display:block;
    margin-bottom:2px;
}

.history__preview-sign p{
    margin:0 0 var(--space-2);
    font-size:.85rem;
}

/* ---------------------------------------------------------
   BEMÆRKNINGER
--------------------------------------------------------- */

.history__issue-list{
    display:flex;
    flex-direction:column;
    gap:var(--space-1);
}

.history__issue{
    display:grid;
    grid-template-columns:120px 1fr;
    gap:var(--space-3);

    padding:8px var(--space-3);

    border-left:3px solid var(--color-border);
    background:#F9FAFB;
    border-radius:var(--radius-sm);

    font-size:.86rem;
}

.history__issue.is-error{
    border-left-color:var(--color-danger);
    background:#FEF2F2;
}

.history__issue.is-warning{
    border-left-color:var(--color-warning);
    background:#FFFBEB;
}

/* ---------------------------------------------------------
   SMÅ SKÆRME
--------------------------------------------------------- */

@media (max-width: 900px){
    .history__map-row{
        grid-template-columns:1fr;
        gap:var(--space-1);
    }

    .history__issue{
        grid-template-columns:1fr;
        gap:2px;
    }
}