@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@400;600;700&family=IM+Fell+English:ital@0;1&family=Special+Elite&display=swap');
:root {
    --paper-bg: #faf6ef;
    --paper-shadow: #c9b99a;
    --paper-border: #d4c5a9;
    --ink-dark: #1a1207;
    --ink-mid: #3d2b0e;
    --ink-light: #6b4c1e;
    --ink-faint: #a08060;
    --stamp-green: #2d6a4f;
    --stamp-red: #c1121f;
    --stamp-yellow: #d4a017;
    --line-color: #ddd0bb;
    --page-bg: #e8e0d4;
}

/* ===== HEADER ===== */
.page-header {
    text-align: center;
    margin-bottom: 2.5rem;
}

.page-header .logo-text {
    /*font-family: 'Special Elite', cursive;*/
    font-size: clamp(1.6rem, 4vw, 2.8rem);
    color: var(--ink-dark);
    letter-spacing: 0.05em;
    margin: 0;
    line-height: 1.1;
}

.page-header .subtitle {
    font-family: 'Source Code Pro', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.3em;
    color: var(--ink-faint);
    margin-top: 0.3rem;
    text-transform: uppercase;
}

.header-rule {
    border: none;
    border-top: 2px solid var(--ink-mid);
    border-bottom: 1px solid var(--ink-mid);
    height: 4px;
    margin: 0.8rem auto;
    max-width: 400px;
}

/* ===== NF ACCORDION CARD ===== */
.nf-wrapper {
    position: relative;
    margin-bottom: 2.2rem;
}

/* Paper stack depth effect */
.nf-wrapper::before,
.nf-wrapper::after {
    content: '';
    position: absolute;
    left: 6px;
    right: -6px;
    background: #ede4d3;
    border: 1px solid var(--paper-border);
    border-radius: 2px;
    z-index: 0;
}
.nf-wrapper::before {
    top: 6px;
    bottom: -6px;
}
.nf-wrapper::after {
    top: 10px;
    bottom: -10px;
    left: 11px;
    right: -11px;
    background: #e5dbc8;
    z-index: -1;
}

.nf-card {
    position: relative;
    z-index: 1;
    background: var(--paper-bg);
    border: 1px solid var(--paper-border);
    border-radius: 2px;
    box-shadow:
        0 2px 8px rgba(80,50,10,0.12),
        inset 0 0 80px rgba(200,180,140,0.08);
    /* Paper texture overlay */
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}

.nf-card:hover {
    box-shadow:
        0 6px 20px rgba(80,50,10,0.18),
        inset 0 0 80px rgba(200,180,140,0.08);
}

/* Left red margin line */
.nf-card::before {
    content: '';
    position: absolute;
    left: 54px;
    top: 0;
    bottom: 0;
    width: 1px;
    background: rgba(193,18,31,0.25);
    z-index: 2;
}

/* ===== ACCORDION HEADER (the folded top strip) ===== */
.nf-header {
    padding: 0.9rem 1.2rem 0.9rem 1.4rem;
    cursor: pointer;
    position: relative;
    border-bottom: 1px dashed var(--line-color);
    background: linear-gradient(180deg, #fdf9f2 0%, var(--paper-bg) 100%);
    user-select: none;
    transition: background 0.2s ease;
}

.nf-header:hover {
    background: linear-gradient(180deg, #fef9ee 0%, #faf4e8 100%);
}

.nf-header.is-open {
    border-bottom: 2px solid var(--paper-border);
}

/* Row number strip on the left */
.nf-header .line-num {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    color: var(--ink-faint);
    letter-spacing: 0.05em;
    border-right: 1px solid var(--line-color);
    flex-direction: column;
    gap: 2px;
}

.nf-number {
    /*font-family: 'Special Elite', cursive;*/
    font-size: clamp(0.85rem, 2vw, 1.05rem);
    font-weight: 700;
    color: var(--ink-dark);
    letter-spacing: 0.04em;
}

.nf-meta {
    font-size: 0.72rem;
    color: var(--ink-faint);
    letter-spacing: 0.06em;
}

.nf-destinatario {
    font-size: 0.82rem;
    color: var(--ink-mid);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.nf-total-preview {
    /*font-family: 'Special Elite', cursive;*/
    font-size: 1.1rem;
    color: var(--ink-dark);
    white-space: nowrap;
}

.nf-chevron {
    transition: transform 0.35s cubic-bezier(0.4,0,0.2,1);
    color: var(--ink-faint);
    font-size: 1rem;
}
.nf-chevron.rotated { transform: rotate(180deg); }

/* ===== STATUS BADGE (stamp style) ===== */
.badge-stamp {
    /*font-family: 'Special Elite', cursive;*/
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    padding: 3px 8px;
    border-radius: 2px;
    border: 1px solid;
    text-transform: uppercase;
}
.stamp-success {
    color: var(--stamp-green);
    border-color: var(--stamp-green);
    background: rgba(45,106,79,0.07);
}
.stamp-warning {
    color: var(--stamp-yellow);
    border-color: var(--stamp-yellow);
    background: rgba(212,160,23,0.07);
}
.stamp-danger {
    color: var(--stamp-red);
    border-color: var(--stamp-red);
    background: rgba(193,18,31,0.07);
    text-decoration: line-through;
}

/* ===== ACCORDION BODY ===== */
.nf-body {
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0.4,0,0.2,1), opacity 0.4s ease;
    max-height: 0;
    opacity: 0;
}
.nf-body.is-open {
    max-height: 1200px;
    opacity: 1;
}

.nf-body-inner {
    padding: 0 1.4rem 1.4rem 1.4rem;
}

/* ===== NF SECTIONS ===== */
.nf-section-title {
    /*font-family: 'Special Elite', cursive;*/
    font-size: 0.72rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--ink-faint);
    border-bottom: 1px solid var(--line-color);
    padding-bottom: 3px;
    margin: 1.2rem 0 0.6rem;
}

.nf-field-label {
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink-faint);
    margin-bottom: 1px;
}

.nf-field-value {
    font-size: 0.82rem;
    color: var(--ink-mid);
    font-weight: 600;
    word-break: break-all;
}

/* ===== PRODUCTS TABLE ===== */
.nf-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
    margin-top: 0.3rem;
}
.nf-table thead tr {
    border-bottom: 2px solid var(--ink-mid);
}
.nf-table thead th {
    /*font-family: 'Special Elite', cursive;*/
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-faint);
    padding: 4px 6px;
    text-align: left;
    font-weight: 400;
}
.nf-table thead th:last-child,
.nf-table thead th:nth-last-child(2) {
    text-align: right;
}
.nf-table tbody tr {
    border-bottom: 1px dashed var(--line-color);
}
.nf-table tbody tr:last-child { border-bottom: none; }
.nf-table tbody td {
    padding: 5px 6px;
    color: var(--ink-mid);
    vertical-align: top;
}
.nf-table tbody td:nth-child(2),
.nf-table tbody td:nth-child(3),
.nf-table tbody td:last-child {
    text-align: right;
    white-space: nowrap;
}
.nf-table tfoot td {
    padding: 4px 6px;
    font-size: 0.78rem;
}
.nf-table tfoot tr.total-row td {
    /*font-family: 'Special Elite', cursive;*/
    font-size: 1rem;
    color: var(--ink-dark);
    border-top: 2px solid var(--ink-mid);
    padding-top: 6px;
}
.nf-table tfoot td:last-child { text-align: right; }

/* ===== CHAVE DE ACESSO ===== */
.chave-acesso {
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    color: var(--ink-faint);
    word-break: break-all;
    line-height: 1.6;
    padding: 6px 8px;
    border: 1px dashed var(--line-color);
    border-radius: 2px;
    background: rgba(180,160,120,0.06);
    margin-top: 0.4rem;
}

/* ===== WATERMARK / STAMP ===== */
.nf-stamp {
    position: absolute;
    bottom: 1.2rem;
    right: 1.4rem;
    /*font-family: 'Special Elite', cursive;*/
    font-size: 1.8rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    opacity: 0.07;
    transform: rotate(-18deg);
    pointer-events: none;
    color: var(--ink-dark);
    font-weight: 700;
}
.stamp-green-wm { color: var(--stamp-green); opacity: 0.1; }
.stamp-red-wm   { color: var(--stamp-red);   opacity: 0.1; }

/* ===== PERFORATED TEAR STRIP ===== */
.tear-strip {
    height: 2px;
    position: relative;
    background: repeating-linear-gradient(
        90deg,
        var(--paper-bg) 0px,
        var(--paper-bg) 10px,
        transparent 10px,
        transparent 14px
    );
    border-top: 1px dashed var(--paper-shadow);
    overflow: hidden;
    flex-shrink: 0;
}

/* ===== PAYMENT INFO ===== */
.pagamento-box {
    background: rgba(180,160,120,0.08);
    border: 1px solid var(--line-color);
    border-radius: 2px;
    padding: 6px 10px;
    font-size: 0.78rem;
    color: var(--ink-mid);
}

/* ===== RESPONSIVO ===== */
@media (max-width: 576px) {
    body { padding: 1rem 0 3rem; }
    .nf-header { padding-left: 1rem; }
    .nf-body-inner { padding: 0 0.8rem 1rem 0.8rem; }
    .nf-card::before { left: 44px; }
    .nf-header .line-num { width: 42px; }
}

/* ===== FOLD LINES ===== */
.fold-line {
    height: 1px;
    background: var(--line-color);
    margin: 0.6rem 0;
    position: relative;
}
.fold-line::before {
    content: '···············································';
    position: absolute;
    top: -9px;
    left: 0; right: 0;
    font-size: 0.6rem;
    letter-spacing: 0.2em;
    color: var(--line-color);
    overflow: hidden;
    white-space: nowrap;
    pointer-events: none;
}
