@import url('https://fonts.googleapis.com/css2?family=Padauk:wght@400;700&display=swap');
body { font-family: 'Padauk', sans-serif; }
.fade-in { animation: fadeIn 0.3s ease-in; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* ── Icon button helper ── */
.icon-btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 6px; border-radius: 6px; border: 1px solid transparent;
    cursor: pointer; transition: background 0.15s;
}
.icon-btn:hover { background: #f3f4f6; border-color: #e5e7eb; }

/* ── Paper / Editor ── */
.editor-page, .a4-paper {
    background: white; padding: 40px; outline: none;
    font-size: 14px; line-height: 1.6; color: #333;
}
.editor-page { box-shadow: 0 4px 6px -1px rgba(0,0,0,.1); min-height: 800px; }

.editor-page h1, .a4-paper h1 { font-size: 24px; font-weight: 800; margin-bottom: 16px; display: block; color: #111; }
.editor-page h2, .a4-paper h2 { font-size: 20px; font-weight: 700; margin-top: 24px; margin-bottom: 12px; display: block; color: #111; }
.editor-page h3, .a4-paper h3 { font-size: 18px; font-weight: 700; margin-top: 16px; margin-bottom: 8px; display: block; color: #333; }
.editor-page p,  .a4-paper p  { margin-bottom: 12px; text-align: justify; }
.editor-page ul, .a4-paper ul { list-style-type: disc; padding-left: 24px; margin-bottom: 12px; }
.editor-page ol, .a4-paper ol { list-style-type: decimal; padding-left: 24px; margin-bottom: 12px; }
.editor-page blockquote, .a4-paper blockquote {
    border-left: 4px solid #e5e7eb; padding-left: 16px;
    color: #4b5563; margin-bottom: 12px; font-style: italic;
}

.editor-page table, .a4-paper table {
    width: 100%; border-collapse: collapse; margin-bottom: 16px; table-layout: fixed;
}
.editor-page td, .editor-page th,
.a4-paper   td, .a4-paper   th {
    border: 1px solid #d1d5db; padding: 8px; vertical-align: top; word-wrap: break-word;
}
.editor-page th, .a4-paper th { background-color: #f9fafb; font-weight: bold; text-align: left; }

/* Invoice table overrides */
.invoice-table td, .invoice-table th { border: none !important; border-bottom: 1px solid #f3f4f6 !important; }
.invoice-table thead th { border-bottom: 2px solid #000 !important; background: transparent !important; }
.invoice-table tbody tr:last-child td { border-bottom: none !important; }
.invoice-table th:nth-child(1), .invoice-table td:nth-child(1) { width:7%; }
.invoice-table th:nth-child(2), .invoice-table td:nth-child(2) { width:50%; }
.invoice-table th:nth-child(3), .invoice-table td:nth-child(3) { width:12%; text-align:center; }
.invoice-table th:nth-child(4), .invoice-table td:nth-child(4) { width:15%; text-align:right; }
.invoice-table th:nth-child(5), .invoice-table td:nth-child(5) { width:15%; text-align:right; }

.editor-page img { max-width: 100%; height: auto; margin: 12px 0; border-radius: 4px; }

/* Toolbar */
.editor-toolbar button, .editor-toolbar select {
    padding: 6px; border-radius: 4px; color: #4b5563;
    transition: background-color 0.2s; border: 1px solid transparent;
}
.editor-toolbar select { border-color: #d1d5db; padding: 4px 8px; }
.editor-toolbar button:hover { background-color: #f3f4f6; border-color: #d1d5db; }

/* A4 Paper container */
.paper-container {
    width: 100%; overflow: auto; display: flex; justify-content: center;
    background: #525659; padding: 40px 0; min-height: 100vh;
}
.a4-paper {
    width: 210mm; min-height: 297mm; height: auto; background: white;
    box-shadow: 0 0 15px rgba(0,0,0,.2); padding: 20mm;
    position: relative; flex-shrink: 0; box-sizing: border-box;
    display: flex; flex-direction: column;
}

@media screen and (max-width: 850px) {
    .paper-scaler { transform-origin: top center; }
    .paper-container { padding: 20px 0; align-items: flex-start; }
}

@media print {
    body * { visibility: hidden; }
    .a4-paper, .a4-paper * { visibility: visible; }
    .a4-paper {
        position: absolute; left: 0; top: 0;
        width: 100%; margin: 0; padding: 0;
        box-shadow: none; border: none; min-height: auto;
    }
    @page { size: auto; margin: 12.7mm; }
    .no-print { display: none !important; }
    .paper-container { padding: 0; background: white; display: block; height: auto !important; }
    .paper-scaler { transform: none !important; }
}

.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }