*, *::before, *::after { box-sizing: border-box; }
body { font-family: sans-serif; max-width: 960px; margin: 40px auto; padding: 0 16px; color: #222; }
h1 { font-size: 1.3rem; margin-bottom: 1.5rem; }

/* Upload page */
.upload-wrap { max-width: 480px; margin: 40px auto; }
#upload-form { transition: opacity .2s ease; }
label { display: block; margin-bottom: .5rem; font-weight: 600; }
input[type="file"] { display: block; margin-bottom: 1.5rem; }
input[type="text"], input[type="password"] {
    display: block;
    width: 100%;
    margin-bottom: 1rem;
    padding: .45rem .6rem;
    font-size: .95rem;
    border: 1px solid #d0d5dd;
    border-radius: 4px;
}
.parser-btns { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; }
.btn-manual { background: #374151; font-size: .85rem; padding: .45rem 1rem; }
.btn-manual:hover { background: #1f2937; }
.note { margin-top: 1rem; font-size: .85rem; color: #666; }

/* Settings panel */
.settings {
    border: 1px solid #d0d5dd;
    border-radius: 6px;
    margin-bottom: 1.75rem;
    font-size: .9rem;
}
.settings summary {
    padding: .6rem .9rem;
    cursor: pointer;
    font-weight: 600;
    color: #555;
    user-select: none;
}
.settings summary:hover { color: #222; }
.settings-body { padding: .75rem .9rem 1rem; border-top: 1px solid #eaecf0; }
.settings-row {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: .25rem;
}
#save-settings { padding: .4rem 1rem; font-size: .85rem; }
#settings-status { font-size: .85rem; color: #057a55; }

/* Loading state */
.loading { display: none; text-align: center; padding: 3rem 0; }
.loading.active { display: block; }
.spinner {
    width: 2.5rem;
    height: 2.5rem;
    margin: 0 auto 1.25rem;
    border: 3px solid #e0e7ff;
    border-top-color: #1a56db;
    border-radius: 50%;
    animation: spin .8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.loading-label { color: #555; font-size: .95rem; margin: 0; }

/* Buttons */
button, .btn {
    background: #1a56db;
    color: #fff;
    border: none;
    padding: .6rem 1.4rem;
    font-size: 1rem;
    border-radius: 4px;
    cursor: pointer;
}
button:hover, .btn:hover { background: #1346c0; }

/* Top invoice card */
.top-card {
    background: #f0f7ff;
    border: 1px solid #c3d9f5;
    border-radius: 6px;
    padding: 1rem 1.25rem;
    margin-bottom: 1.75rem;
}
.top-card h2 { font-size: 1rem; margin: 0 0 .75rem; }
.copy-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .5rem;
}
.copy-row span {
    flex: 1;
    font-size: .9rem;
    background: #fff;
    border: 1px solid #d0d5dd;
    border-radius: 4px;
    padding: .35rem .6rem;
    word-break: break-all;
}
.copy-btn {
    background: #1a56db;
    color: #fff;
    border: none;
    padding: .35rem .75rem;
    font-size: .8rem;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
}
.copy-btn:hover { background: #1346c0; }
.copy-btn.ok { background: #057a55; }

/* Results table */
table { width: 100%; border-collapse: collapse; font-size: .88rem; }
th { text-align: left; padding: .5rem .6rem; border-bottom: 2px solid #d0d5dd; color: #555; font-weight: 600; }
td { padding: .5rem .6rem; border-bottom: 1px solid #eaecf0; vertical-align: top; }
tr:hover td { background: #f9fafb; }
tr.checked td { background: #f0fdf4; color: #6b7280; }
tr.checked .links a { color: #6b7280; }

.check-cell { width: 2rem; text-align: center; }
.check-btn {
    background: none;
    border: 2px solid #d0d5dd;
    color: transparent;
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 4px;
    cursor: pointer;
    font-size: .9rem;
    line-height: 1;
    padding: 0;
    transition: background .15s, border-color .15s, color .15s;
}
.check-btn:hover { border-color: #1a56db; color: #c3d9f5; }
tr.checked .check-btn { background: #057a55; border-color: #057a55; color: #fff; }

/* Row type badges */
.badge {
    display: inline-block;
    font-size: .75rem;
    padding: .15rem .45rem;
    border-radius: 3px;
    font-weight: 600;
}
.badge-invoice { background: #def7ec; color: #057a55; }
.badge-contact { background: #e1effe; color: #1e429f; }
.badge-feed    { background: #fdf6b2; color: #8a5800; }
.badge-error   { background: #fde8e8; color: #c81e1e; }

.links a { display: block; color: #1a56db; text-decoration: none; margin-bottom: .15rem; }
.links a:hover { text-decoration: underline; }

.back { display: inline-block; margin-bottom: 1.25rem; font-size: .85rem; color: #1a56db; text-decoration: none; }
.back:hover { text-decoration: underline; }

.group-heading { font-size: 1.05rem; margin: 2rem 0 .6rem; border-bottom: 2px solid #d0d5dd; padding-bottom: .3rem; }

.storno-text { flex: 1; font-size: .85rem; font-family: monospace; }

.meta { font-size: .78rem; color: #888; }