body {
    font-family: Inter, system-ui, sans-serif;
    background: #f3f4f6;
    display: flex;
    justify-content: center;
    gap: 20px;
}

.a4 {
    width: 210mm;
    min-height: 297mm;
    background: #fff;
    padding: 25mm;
    box-shadow: 0 0 10px rgba(0,0,0,.08);
}

@media (max-width: 900px) {
    .a4 {
        width: 100%;
        padding: 24px;
    }
}

@media print {
    #actions { display: none !important; }
    .a4 { box-shadow: none; padding: 0; }
}

.editable:focus {
    outline: 2px dashed rgba(37,99,235,.4);
    outline-offset: 2px;
}

.remove-btn {
    cursor: pointer;
    color: #dc2626;
    font-size: 14px;
    margin-left: 6px;
    display: none;
}

.item-cell:hover .remove-btn { display: inline; }

/* Logo container */
.logo-container {
    position: relative;
    width: 85mm;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.logo-placeholder {
    width: 100%;
    border: 1px dashed #bbb;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #999;
    background: #fafafa;
    font-size: 12px;
}

.logo-container img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}

#logoInput { display: none; }

/* Export modus */
.exporting .remove-btn,
.exporting #btnAdd { display: none !important; }

/* Accepteer voorwaarden */
#terms-container {
    margin-top: 8px;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Tabellen */
table {
    border-collapse: collapse;
    width: 100%;
}

th, td {
    padding: 8px;
    text-align: left;
}

th {
    background-color: #333;
    color: white;
}

td.text-right { text-align: right; }
td.text-center { text-align: center; }

button {
    cursor: pointer;
    border: none;
}

button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}