/* ===== DanaSync Global Styles ===== */

body {
    background-color: #f8f9ff;
}

/* Material Symbols Icons */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.material-symbols-outlined.fill {
    font-variation-settings: 'FILL' 1;
}

/* Reports Table */
.table-border {
    border: 1px solid #c3c6d1;
}
.table-header {
    background-color: #e5eeff;
}
.table-row-hover:hover {
    background-color: #f0f4ff;
}
.indent-1 {
    padding-left: 1.5rem !important;
}
.indent-2 {
    padding-left: 3rem !important;
}
.indent-3 {
    padding-left: 4.5rem !important;
}

/* Custom Scrollbar (Data page) */
.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background-color: #c3c6d1;
    border-radius: 20px;
}

/* ===== Print styles (Pengaturan Cetak) ===== */
/* Printing only the document canvas (#paper) at full printable width.
   The app shell (nav, topbar, settings) is display:none so it takes no layout
   space and does not interfere with print scaling/fit. The @page rule pins
   A4 landscape so the browser never needs manual "fit to printable area". */
@media print {
    @page {
        size: A4 landscape;
        margin: 0;
    }
    body {
        display: block !important;
        height: auto !important;
        overflow: visible !important;
        background: #ffffff !important;
    }
    main {
        display: block !important;
        height: auto !important;
        overflow: visible !important;
    }
    nav,
    aside,
    main > header,
    .print-hide {
        display: none !important;
    }
    main > div {
        overflow: visible !important;
        height: auto !important;
        padding: 0 !important;
    }
    main > div > div {
        overflow: visible !important;
        height: auto !important;
        gap: 0 !important;
    }
    .print-preview {
        padding: 0 !important;
        border: none !important;
        background: #ffffff !important;
        justify-content: flex-start !important;
    }
    #paper {
        display: block !important;
        margin: 0 !important;
        border: none !important;
        box-shadow: none !important;
        padding: 12mm !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 0 !important;
        gap: 0 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    #paper .table-wrap {
        overflow: visible !important;
        max-width: 100% !important;
    }
    #paper table {
        width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed;
        border-collapse: collapse !important;
        font-size: 8px;
        line-height: 1.3;
    }
    #paper col.px-c-uraian { width: 30%; }
    #paper col.px-c-num { width: 9.5%; }
    #paper col.px-c-pct { width: 6%; }
    #paper col.px-c-sisa { width: 12.5%; }
    #paper thead {
        display: table-header-group;
    }
    #paper tr {
        page-break-inside: avoid;
        break-inside: avoid;
    }
    #paper th {
        font-size: 8px !important;
        font-weight: 600 !important;
        padding: 2px 4px !important;
        white-space: nowrap !important;
    }
    #paper td {
        font-size: 8px !important;
        padding: 2px 4px;
    }
    #paper td:nth-child(2),
    #paper td:nth-child(3),
    #paper td:nth-child(4),
    #paper td:nth-child(5),
    #paper td:nth-child(6),
    #paper td:nth-child(7),
    #paper td:nth-child(8) {
        white-space: nowrap !important;
        text-align: right !important;
    }
    #paper td:nth-child(1) {
        white-space: normal !important;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    #paper footer#ttd-block {
        margin-top: 6mm !important;
        page-break-inside: avoid;
        break-inside: avoid;
    }
}