/* ── Reset de Bootstrap dentro del scope ── */
    .pt-app * { box-sizing: border-box; }
    .pt-app, .pt-nav { font-family: 'Plus Jakarta Sans', sans-serif; }

    /* ── Variables ── */
    .pt-app {
      --pt-bg:         #f4f6fa;
      --pt-surface:    #ffffff;
      --pt-border:     #e2e8f0;
      --pt-border-md:  #cbd5e1;
      --pt-text:       #1e293b;
      --pt-muted:      #64748b;
      --pt-subtle:     #94a3b8;
      --pt-accent:     #2563eb;
      --pt-accent-lt:  #eff6ff;
      --pt-green:      #16a34a;
      --pt-green-lt:   #f0fdf4;
      --pt-yellow:     #b45309;
      --pt-yellow-lt:  #fffbeb;
      --pt-red:        #dc2626;
      --pt-red-lt:     #fef2f2;
      --pt-radius:     10px;
      --pt-shadow:     0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
      --pt-shadow-md:  0 4px 12px rgba(0,0,0,.10);
    }

    /* ── Navbar ── */
    .pt-nav {
      background: #fff;
      border-bottom: 1px solid #e2e8f0;
      padding: .85rem 1.5rem;
      display: flex;
      align-items: center;
      gap: 1rem;
    }
    .pt-nav__brand {
      font-weight: 700;
      font-size: 1.1rem;
      color: #1e293b;
      letter-spacing: -.3px;
      text-decoration: none;
    }
    .pt-nav__brand span { color: #2563eb; }
    .pt-nav__badge {
      background: #eff6ff;
      color: #2563eb;
      border: 1px solid #bfdbfe;
      border-radius: 999px;
      font-size: .7rem;
      font-family: 'JetBrains Mono', monospace;
      padding: 2px 10px;
    }
    .pt-nav__dot {
      margin-left: auto;
      font-size: .78rem;
      color: #64748b;
      display: flex;
      align-items: center;
      gap: .4rem;
    }
    .pt-nav__dot::before {
      content: '';
      width: 7px; height: 7px;
      background: #16a34a;
      border-radius: 50%;
      display: inline-block;
    }

    /* ── Layout ── */
    .pt-app {
      background: var(--pt-bg);
      min-height: 100vh;
    }
    .pt-wrap {
      max-width: 1080px;
      margin: 0 auto;
      padding: 2.2rem 1.25rem 4rem;
    }

    /* ── Stat cards ── */
    .pt-stat {
      background: var(--pt-surface);
      border: 1px solid var(--pt-border);
      border-radius: var(--pt-radius);
      box-shadow: var(--pt-shadow);
      padding: 1.1rem 1.3rem;
      display: flex;
      align-items: center;
      gap: 1rem;
    }
    .pt-stat__icon {
      width: 44px; height: 44px;
      border-radius: 8px;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.05rem;
      flex-shrink: 0;
    }
    .pt-stat__icon--blue   { background: #dbeafe; color: #1d4ed8; }
    .pt-stat__icon--green  { background: #dcfce7; color: #15803d; }
    .pt-stat__icon--yellow { background: #fef9c3; color: #a16207; }
    .pt-stat__label { font-size: .7rem; color: var(--pt-muted); text-transform: uppercase; letter-spacing: .5px; font-weight: 600; }
    .pt-stat__value { font-size: 1.5rem; font-weight: 700; color: var(--pt-text); line-height: 1.15; }

    /* ── Section header ── */
    .pt-section-title { font-size: 1.35rem; font-weight: 700; color: var(--pt-text); letter-spacing: -.3px; margin-bottom: .2rem; }
    .pt-section-sub   { font-size: .84rem; color: var(--pt-muted); margin-bottom: 0; }

    /* ── Search input ── */
    .pt-search {
      background: var(--pt-surface);
      border: 1px solid var(--pt-border);
      border-radius: var(--pt-radius);
      padding: .6rem 1rem;
      font-size: .875rem;
      color: var(--pt-text);
      font-family: 'Plus Jakarta Sans', sans-serif;
      width: 100%;
      transition: border-color .2s, box-shadow .2s;
    }
    .pt-search::placeholder { color: var(--pt-subtle); }
    .pt-search:focus {
      outline: none;
      border-color: #93c5fd;
      box-shadow: 0 0 0 3px rgba(37,99,235,.12);
    }

    /* ── Provider card ── */
    .pt-card {
      background: var(--pt-surface);
      border: 1px solid var(--pt-border);
      border-radius: var(--pt-radius);
      box-shadow: var(--pt-shadow);
      margin-bottom: .75rem;
      overflow: hidden;
      transition: border-color .2s, box-shadow .2s;
    }
    .pt-card:hover       { border-color: var(--pt-border-md); box-shadow: var(--pt-shadow-md); }
    .pt-card--open       { border-color: #93c5fd !important; box-shadow: 0 0 0 3px rgba(37,99,235,.08); }

    .pt-card__header {
      padding: 1rem 1.3rem;
      display: flex;
      align-items: center;
      gap: .9rem;
      cursor: pointer;
      user-select: none;
    }
    .pt-card__avatar {
      width: 42px; height: 42px;
      border-radius: 8px;
      background: linear-gradient(135deg, #3b82f6, #1d4ed8);
      color: #fff;
      font-weight: 700;
      font-size: .9rem;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .pt-card__name  { font-weight: 600; font-size: .95rem; color: var(--pt-text); margin-bottom: .1rem; }
    .pt-card__meta  { font-size: .76rem; color: var(--pt-muted); font-family: 'JetBrains Mono', monospace; }
    .pt-card__pills { margin-left: auto; display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }

    /* ── Pills ── */
    .pt-pill {
      font-size: .68rem; font-weight: 600;
      font-family: 'JetBrains Mono', monospace;
      border-radius: 999px; padding: 3px 9px;
      border: 1px solid;
      white-space: nowrap;
    }
    .pt-pill--blue   { background: var(--pt-accent-lt); color: var(--pt-accent); border-color: #bfdbfe; }
    .pt-pill--yellow { background: var(--pt-yellow-lt); color: var(--pt-yellow); border-color: #fde68a; }
    .pt-pill--green  { background: var(--pt-green-lt);  color: var(--pt-green);  border-color: #bbf7d0; }
    .pt-pill--red    { background: var(--pt-red-lt);    color: var(--pt-red);    border-color: #fecaca; }

    .pt-chevron {
      color: var(--pt-subtle);
      font-size: .78rem;
      transition: transform .25s;
      flex-shrink: 0;
    }
    .pt-card--open .pt-chevron { transform: rotate(180deg); }

    /* ── Invoices panel ── */
    .pt-panel {
      display: none;
      border-top: 1px solid var(--pt-border);
    }
    .pt-panel--show { display: block; animation: pt-fadeDown .2s ease; }
    @keyframes pt-fadeDown {
      from { opacity:0; transform:translateY(-5px); }
      to   { opacity:1; transform:translateY(0); }
    }

    /* ── Loading ── */
    .pt-loading {
      padding: 2rem; text-align: center; color: var(--pt-muted); font-size: .85rem;
    }
    .pt-spinner {
      width: 26px; height: 26px;
      border: 2.5px solid var(--pt-border);
      border-top-color: var(--pt-accent);
      border-radius: 50%;
      animation: pt-spin .65s linear infinite;
      margin: 0 auto .6rem;
    }
    @keyframes pt-spin { to { transform: rotate(360deg); } }

    /* ── Contact info strip ── */
    .pt-contact {
      display: flex; flex-wrap: wrap; gap: .4rem 1.4rem;
      padding: .8rem 1.3rem;
      background: #f8fafc;
      border-bottom: 1px solid var(--pt-border);
      font-size: .78rem;
      color: var(--pt-muted);
    }
    .pt-contact i { margin-right: .3rem; }

    /* ── Summary bar inside panel ── */
    .pt-summary {
      display: flex; flex-wrap: wrap; gap: .4rem;
      padding: .7rem 1.3rem;
      border-bottom: 1px solid var(--pt-border);
      background: #fff;
    }

    /* ── Invoices table ── */
    .pt-table-wrap { padding: .75rem 1.3rem 1.2rem; overflow-x: auto; }

    .pt-table {
      width: 100%;
      border-collapse: collapse;
      font-size: .82rem;
    }
    .pt-table thead th {
      color: var(--pt-muted);
      font-weight: 600;
      font-size: .69rem;
      text-transform: uppercase;
      letter-spacing: .5px;
      padding: .4rem .7rem;
      border-bottom: 1px solid var(--pt-border);
      background: #f8fafc;
      white-space: nowrap;
    }
    .pt-table tbody tr {
      border-bottom: 1px solid #f1f5f9;
      transition: background .12s;
    }
    .pt-table tbody tr:last-child { border-bottom: none; }
    .pt-table tbody tr:hover { background: #f8fafc; }
    .pt-table tbody td {
      padding: .7rem .7rem;
      color: var(--pt-text);
      vertical-align: middle;
    }
    .pt-table .pt-mono { font-family: 'JetBrains Mono', monospace; }
    .pt-table .pt-amount { font-weight: 600; color: var(--pt-text); }

    /* Estado badges en tabla */
    .pt-badge {
      font-size: .66rem; font-weight: 600;
      font-family: 'JetBrains Mono', monospace;
      border-radius: 999px; padding: 2px 9px;
      border: 1px solid;
    }
    .pt-badge--pagada    { background: var(--pt-green-lt);  color: var(--pt-green);  border-color: #bbf7d0; }
    .pt-badge--pendiente { background: var(--pt-yellow-lt); color: var(--pt-yellow); border-color: #fde68a; }
    .pt-badge--anulada   { background: var(--pt-red-lt);    color: var(--pt-red);    border-color: #fecaca; }

    /* ── Botón ver factura ── */
    .pt-btn-eye {
      display: inline-flex; align-items: center; justify-content: center;
      width: 30px; height: 30px;
      border-radius: 6px;
      background: var(--pt-accent-lt);
      color: var(--pt-accent);
      border: 1px solid #bfdbfe;
      font-size: .8rem;
      cursor: pointer;
      text-decoration: none;
      transition: background .15s, color .15s, border-color .15s;
    }
    .pt-btn-eye:hover {
      background: var(--pt-accent);
      color: #fff;
      border-color: var(--pt-accent);
      text-decoration: none;
    }

    /* ── Botón nueva factura (+ en card header) ── */
    .pt-btn-new {
      display: inline-flex; align-items: center; justify-content: center;
      width: 30px; height: 30px;
      border-radius: 6px;
      background: var(--pt-green-lt);
      color: var(--pt-green);
      border: 1px solid #bbf7d0;
      font-size: .85rem;
      cursor: pointer;
      text-decoration: none;
      transition: background .15s, color .15s, border-color .15s;
      flex-shrink: 0;
    }
    .pt-btn-new:hover {
      background: var(--pt-green);
      color: #fff;
      border-color: var(--pt-green);
      text-decoration: none;
    }

    /* ── Botón nueva factura en panel (dentro del summary bar) ── */
    .pt-btn-new-panel {
      display: inline-flex; align-items: center; gap: .4rem;
      font-size: .78rem; font-weight: 600;
      color: var(--pt-green);
      background: var(--pt-green-lt);
      border: 1px solid #bbf7d0;
      border-radius: 7px; padding: 4px 12px;
      cursor: pointer; text-decoration: none;
      transition: background .15s, color .15s;
      font-family: 'Plus Jakarta Sans', sans-serif;
    }
    .pt-btn-new-panel:hover {
      background: var(--pt-green);
      color: #fff;
      border-color: var(--pt-green);
      text-decoration: none;
    }

    /* ── Botón nueva factura (+) en header del proveedor ── */
    .pt-btn-add-fact {
      display: inline-flex; align-items: center; justify-content: center;
      width: 30px; height: 30px;
      border-radius: 6px;
      background: var(--pt-green-lt);
      color: var(--pt-green);
      border: 1px solid #bbf7d0;
      font-size: .85rem;
      font-weight: 700;
      cursor: pointer;
      text-decoration: none;
      flex-shrink: 0;
      transition: background .15s, color .15s, border-color .15s, transform .1s;
      position: relative;
      z-index: 2;
    }
    .pt-btn-add-fact:hover {
      background: var(--pt-green);
      color: #fff;
      border-color: var(--pt-green);
      text-decoration: none;
      transform: scale(1.08);
    }

    /* ── Items badge (cant de líneas) ── */
    .pt-items-count {
      font-size: .67rem;
      color: var(--pt-muted);
      font-family: 'JetBrains Mono', monospace;
    }

    /* ── Empty / No results ── */
    .pt-empty {
      text-align: center; color: var(--pt-muted);
      padding: 2.5rem 1rem; font-size: .875rem;
    }
    .pt-empty i { font-size: 1.8rem; margin-bottom: .5rem; display: block; color: var(--pt-subtle); }

    #pt-no-results {
      display: none;
      text-align: center; color: var(--pt-muted);
      padding: 3rem; font-size: .9rem;
    }

    /* ── Toast ── */
    #pt-toasts {
      position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 9999;
    }
    .pt-toast {
      background: #1e293b; color: #f1f5f9;
      border-radius: 8px; padding: .7rem 1rem;
      font-size: .8rem; display: flex; align-items: center; gap: .55rem;
      box-shadow: 0 8px 24px rgba(0,0,0,.18);
      animation: pt-slideUp .22s ease;
      margin-top: .45rem;
      font-family: 'Plus Jakarta Sans', sans-serif;
    }
    .pt-toast--ok  { border-left: 3px solid #22c55e; }
    .pt-toast--err { border-left: 3px solid #ef4444; }
    @keyframes pt-slideUp {
      from { opacity:0; transform:translateY(10px); }
      to   { opacity:1; transform:translateY(0); }
    }

    .pt-custom-panel {
  display: none;
}

.nf-app *, .nf-nav * { box-sizing: border-box; }
    .nf-app, .nf-nav { font-family: 'Plus Jakarta Sans', sans-serif; }

    /* ── Variables ── */
    .nf-app {
      --nf-bg:        #f4f6fa;
      --nf-surface:   #ffffff;
      --nf-border:    #e2e8f0;
      --nf-border-md: #cbd5e1;
      --nf-text:      #1e293b;
      --nf-muted:     #64748b;
      --nf-subtle:    #94a3b8;
      --nf-accent:    #2563eb;
      --nf-accent-lt: #eff6ff;
      --nf-green:     #16a34a;
      --nf-green-lt:  #f0fdf4;
      --nf-yellow:    #b45309;
      --nf-yellow-lt: #fffbeb;
      --nf-red:       #dc2626;
      --nf-red-lt:    #fef2f2;
      --nf-radius:    10px;
      --nf-shadow:    0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
      --nf-shadow-md: 0 4px 14px rgba(0,0,0,.10);
    }

    /* ── Navbar ── */
    .nf-nav {
      background: #fff;
      border-bottom: 1px solid #e2e8f0;
      padding: .85rem 1.5rem;
      display: flex; align-items: center; gap: .8rem;
      position: sticky; top: 0; z-index: 100;
    }
    .nf-nav__back {
      display: inline-flex; align-items: center; gap: .4rem;
      color: #64748b; font-size: .85rem; text-decoration: none;
      font-family: 'Plus Jakarta Sans', sans-serif; transition: color .15s;
    }
    .nf-nav__back:hover { color: #2563eb; text-decoration: none; }
    .nf-nav__sep   { color: #cbd5e1; }
    .nf-nav__title { font-weight: 700; font-size: 1rem; color: #1e293b; }
    .nf-nav__prov  {
      font-family: 'JetBrains Mono', monospace; font-size: .75rem; color: #64748b;
      background: #f1f5f9; border-radius: 999px; padding: 2px 10px;
      border: 1px solid #e2e8f0; max-width: 220px;
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .nf-nav__actions { margin-left: auto; display: flex; align-items: center; gap: .5rem; }

    /* ── Buttons ── */
    .nf-btn {
      display: inline-flex; align-items: center; gap: .4rem;
      border-radius: 8px; padding: .45rem 1.1rem;
      font-size: .82rem; font-weight: 600; cursor: pointer;
      font-family: 'Plus Jakarta Sans', sans-serif;
      border: 1px solid; transition: all .15s; text-decoration: none;
    }
    .nf-btn--primary {
      background: #2563eb; color: #fff; border-color: #2563eb;
    }
    .nf-btn--primary:hover { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }
    .nf-btn--primary:disabled { background: #94a3b8; border-color: #94a3b8; cursor: not-allowed; }
    .nf-btn--ghost {
      background: #fff; color: #64748b; border-color: #e2e8f0;
    }
    .nf-btn--ghost:hover { background: #f8fafc; color: #1e293b; border-color: #cbd5e1; text-decoration: none; }

    /* ── Layout ── */
    .nf-app { background: var(--nf-bg); min-height: 100vh; }
    .nf-wrap { max-width: 1000px; margin: 0 auto; padding: 2rem 1.25rem 4rem; }

    /* ── Page header ── */
    .nf-page-header {
      margin-bottom: 1.5rem;
    }
    .nf-page-title {
      font-size: 1.35rem; font-weight: 700; color: var(--nf-text);
      letter-spacing: -.3px; margin-bottom: .2rem;
      display: flex; align-items: center; gap: .6rem;
    }
    .nf-page-title i { color: var(--nf-accent); font-size: 1.1rem; }
    .nf-page-sub { font-size: .84rem; color: var(--nf-muted); }

    /* ── Cards ── */
    .nf-card {
      background: var(--nf-surface);
      border: 1px solid var(--nf-border);
      border-radius: var(--nf-radius);
      box-shadow: var(--nf-shadow);
      margin-bottom: 1.25rem;
      overflow: hidden;
    }
    .nf-card__head {
      padding: .9rem 1.3rem;
      border-bottom: 1px solid var(--nf-border);
      display: flex; align-items: center; justify-content: space-between;
      background: #f8fafc;
    }
    .nf-card__htitle {
      font-weight: 700; font-size: .9rem; color: var(--nf-text);
      display: flex; align-items: center; gap: .5rem;
    }
    .nf-card__htitle i { color: var(--nf-accent); }
    .nf-card__body { padding: 1.3rem; }

    /* ── Proveedor selector ── */
    .nf-prov-selector {
      display: flex; align-items: center; gap: 1rem;
      padding: 1rem 1.3rem;
      background: linear-gradient(135deg, #eff6ff 0%, #fff 100%);
      border-bottom: 1px solid var(--nf-border);
    }
    .nf-prov-avatar {
      width: 46px; height: 46px; border-radius: 9px;
      background: linear-gradient(135deg, #3b82f6, #1d4ed8);
      color: #fff; font-weight: 700; font-size: .95rem;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .nf-prov-name { font-weight: 700; font-size: .98rem; color: var(--nf-text); }
    .nf-prov-meta { font-size: .75rem; color: var(--nf-muted); margin-top: .1rem; }
    .nf-prov-meta span { margin-right: .9rem; }
    .nf-prov-meta i   { margin-right: .3rem; }

    /* ── Proveedor loading / error ── */
    .nf-prov-loading {
      padding: 1rem 1.3rem; font-size: .85rem; color: var(--nf-muted);
      display: flex; align-items: center; gap: .6rem;
    }

    /* ── Select field (proveedor dropdown when no ?prov param) ── */
    .nf-prov-dropdown-wrap { padding: 1rem 1.3rem; }

    /* ── Form grid ── */
    .nf-form-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
      gap: 1rem;
    }
    .nf-field { display: flex; flex-direction: column; gap: .3rem; }
    .nf-label {
      font-size: .7rem; font-weight: 600; text-transform: uppercase;
      letter-spacing: .5px; color: var(--nf-muted);
    }
    .nf-label .nf-req { color: var(--nf-red); margin-left: 2px; }

    .nf-input {
      background: #fff; border: 1px solid var(--nf-border); border-radius: 7px;
      padding: .5rem .75rem; font-size: .875rem; color: var(--nf-text); width: 100%;
      font-family: 'Plus Jakarta Sans', sans-serif;
      transition: border-color .2s, box-shadow .2s;
    }
    .nf-input:focus {
      outline: none; border-color: #93c5fd;
      box-shadow: 0 0 0 3px rgba(37,99,235,.10);
    }
    .nf-input--mono { font-family: 'JetBrains Mono', monospace; }
    .nf-input--err  { border-color: #fca5a5 !important; background: #fff5f5; }

    .nf-select {
      appearance: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Cpath fill='%2364748b' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
      background-repeat: no-repeat; background-position: right .7rem center;
      padding-right: 2rem;
    }

    .nf-textarea {
      background: #fff; border: 1px solid var(--nf-border); border-radius: 7px;
      padding: .6rem .8rem; font-size: .875rem; color: var(--nf-text);
      width: 100%; resize: vertical; min-height: 72px;
      font-family: 'Plus Jakarta Sans', sans-serif;
      transition: border-color .2s, box-shadow .2s;
    }
    .nf-textarea:focus { outline: none; border-color: #93c5fd; box-shadow: 0 0 0 3px rgba(37,99,235,.1); }

    .nf-error-tip {
      font-size: .7rem; color: var(--nf-red); margin-top: .15rem; display: none;
    }

    /* ── Items table ── */
    .nf-items-table {
      width: 100%; border-collapse: collapse; font-size: .83rem;
    }
    .nf-items-table thead th {
      color: var(--nf-muted); font-weight: 600; font-size: .69rem;
      text-transform: uppercase; letter-spacing: .5px;
      padding: .45rem .7rem; border-bottom: 2px solid var(--nf-border);
      background: #f8fafc; white-space: nowrap;
    }
    .nf-items-table tbody tr { border-bottom: 1px solid #f1f5f9; }
    .nf-items-table tbody tr:last-child { border-bottom: none; }
    .nf-items-table tbody tr:hover { background: #f8fafc; }
    .nf-items-table tbody td { padding: .55rem .7rem; vertical-align: middle; color: var(--nf-text); }

    /* Input inside table */
    .nf-td-input {
      background: #fff; border: 1px solid var(--nf-border); border-radius: 6px;
      padding: .38rem .55rem; font-size: .8rem; width: 100%;
      font-family: 'Plus Jakarta Sans', sans-serif; color: var(--nf-text);
    }
    .nf-td-input:focus { outline: none; border-color: #93c5fd; box-shadow: 0 0 0 2px rgba(37,99,235,.1); }
    .nf-td-input--mono { font-family: 'JetBrains Mono', monospace; }

    /* ── Add row button ── */
    .nf-btn-add-row {
      display: inline-flex; align-items: center; gap: .4rem;
      font-size: .8rem; font-weight: 600; color: var(--nf-accent);
      background: var(--nf-accent-lt); border: 1px dashed #93c5fd;
      border-radius: 7px; padding: .45rem 1rem; cursor: pointer;
      font-family: 'Plus Jakarta Sans', sans-serif; transition: background .15s;
    }
    .nf-btn-add-row:hover { background: #dbeafe; }

    /* ── Delete row ── */
    .nf-btn-del-row {
      background: none; border: none; color: #ef4444;
      cursor: pointer; padding: 4px; font-size: .82rem;
      border-radius: 5px; transition: background .15s;
    }
    .nf-btn-del-row:hover { background: #fef2f2; }

    /* ── Subtotal cell ── */
    .nf-sub-cell {
      font-family: 'JetBrains Mono', monospace;
      font-weight: 600; color: var(--nf-accent);
      white-space: nowrap;
    }

    /* ── Totals ── */
    .nf-totals {
      padding: 1rem 1.3rem; border-top: 1px solid var(--nf-border);
      display: flex; justify-content: flex-end;
    }
    .nf-totals-grid {
      display: grid; grid-template-columns: auto auto; gap: .3rem 2rem;
      text-align: right;
    }
    .nf-totals-label { font-size: .78rem; color: var(--nf-muted); font-weight: 500; }
    .nf-totals-value { font-size: .82rem; font-family: 'JetBrains Mono', monospace; color: var(--nf-text); }
    .nf-totals-total .nf-totals-label { font-size: .92rem; font-weight: 700; color: var(--nf-text); }
    .nf-totals-total .nf-totals-value { font-size: .98rem; font-weight: 700; color: var(--nf-accent); }

    /* ── No-items placeholder ── */
    .nf-items-empty {
      text-align: center; color: var(--nf-subtle);
      padding: 1.8rem; font-size: .82rem;
    }
    .nf-items-empty i { font-size: 1.5rem; display: block; margin-bottom: .4rem; }

    /* ── Spinner ── */
    .nf-spinner {
      width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.4);
      border-top-color: #fff; border-radius: 50%;
      animation: nf-spin .6s linear infinite; display: inline-block;
    }
    @keyframes nf-spin { to { transform: rotate(360deg); } }

    /* ── Loading inline ── */
    .nf-inline-spinner {
      width: 18px; height: 18px; border: 2px solid var(--nf-border);
      border-top-color: var(--nf-accent); border-radius: 50%;
      animation: nf-spin .6s linear infinite; display: inline-block;
    }

    /* ── Pills ── */
    .nf-pill {
      font-size: .68rem; font-weight: 600; font-family: 'JetBrains Mono', monospace;
      border-radius: 999px; padding: 3px 9px; border: 1px solid; white-space: nowrap;
    }
    .nf-pill--green  { background: var(--nf-green-lt);  color: var(--nf-green);  border-color: #bbf7d0; }
    .nf-pill--yellow { background: var(--nf-yellow-lt); color: var(--nf-yellow); border-color: #fde68a; }
    .nf-pill--red    { background: var(--nf-red-lt);    color: var(--nf-red);    border-color: #fecaca; }

    /* ── Success screen ── */
    .nf-success {
      display: none; text-align: center; padding: 3rem 2rem;
      animation: nf-fadeIn .35s ease;
    }
    .nf-success__icon {
      width: 64px; height: 64px; border-radius: 50%;
      background: var(--nf-green-lt); color: var(--nf-green);
      font-size: 1.8rem; display: flex; align-items: center; justify-content: center;
      margin: 0 auto 1rem;
    }
    .nf-success__title { font-size: 1.2rem; font-weight: 700; color: var(--nf-text); margin-bottom: .4rem; }
    .nf-success__sub   { font-size: .875rem; color: var(--nf-muted); margin-bottom: 1.5rem; }
    .nf-success__actions { display: flex; justify-content: center; gap: .7rem; flex-wrap: wrap; }

    @keyframes nf-fadeIn { from{opacity:0;transform:translateY(8px);} to{opacity:1;transform:translateY(0);} }

    /* ── Toast ── */
    #nf-toasts { position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 9999; }
    .nf-toast {
      background: #1e293b; color: #f1f5f9; border-radius: 8px;
      padding: .7rem 1rem; font-size: .8rem;
      display: flex; align-items: center; gap: .5rem;
      box-shadow: 0 8px 24px rgba(0,0,0,.18);
      animation: nf-slideUp .22s ease; margin-top: .45rem;
      font-family: 'Plus Jakarta Sans', sans-serif;
    }
    .nf-toast--ok  { border-left: 3px solid #22c55e; }
    .nf-toast--err { border-left: 3px solid #ef4444; }
    @keyframes nf-slideUp { from{opacity:0;transform:translateY(10px);} to{opacity:1;transform:translateY(0);} }

    /* ------- mod  ---*/
    /* Variables de color (ajusta los códigos HEX a tu gusto) */
:root {
  --nf-muted: #64748b;
  --nf-red: #ef4444;
  --nf-border: #cbd5e1;
  --nf-text: #1e293b;
}

/* Contenedor de aislamiento */
.nf-custom-form {
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* ── Form grid ── */
.nf-custom-form .nf-form-grid {
  display: grid !important;
  /* Por defecto (Celulares): Una sola columna para que no se amontone */
  grid-template-columns: 1fr;
  gap: 1rem;
  /* Espacio al final de todo el bloque solicitado */
  /* margin-bottom: 2.5rem; */
}

/* Pantallas medianas y grandes (Tablets y Computadoras) */
@media (min-width: 768px) {
  .nf-custom-form .nf-form-grid {
    /* Divide el espacio exactamente en 4 columnas iguales ocupando el 100% */
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

/* Forzar reinicio de márgenes que Bootstrap añade a los form-groups */
.nf-custom-form .nf-field { 
  display: flex !important; 
  flex-direction: column; 
  gap: .3rem; 
  margin-bottom: 0; 
}

.nf-custom-form .nf-label {
  font-size: .7rem !important; 
  font-weight: 600 !important; 
  text-transform: uppercase;
  letter-spacing: .5px; 
  color: var(--nf-muted) !important;
  margin-bottom: 0; /* Quita el margen inferior por defecto de Bootstrap */
}

.nf-custom-form .nf-label .nf-req { 
  color: var(--nf-red) !important; 
  margin-left: 2px; 
}

/* Estilos de los Inputs ganándole a Bootstrap */
.nf-custom-form .nf-input {
  background: #fff !important; 
  border: 1px solid var(--nf-border) !important; 
  border-radius: 7px !important;
  padding: .5rem .75rem !important; 
  font-size: .875rem !important; 
  color: var(--nf-text) !important; 
  width: 100%;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  transition: border-color .2s, box-shadow .2s;
  height: auto !important; /* Evita que Bootstrap altere la altura nativa */
}

.nf-custom-form .nf-input:focus {
  outline: none !important; 
  border-color: #93c5fd !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,.10) !important;
}

.nf-custom-form .nf-input--mono { 
  font-family: 'JetBrains Mono', monospace !important; 
}

.nf-custom-form .nf-input--err { 
  border-color: #fca5a5 !important; 
  background: #fff5f5 !important; 
}

/* Selector personalizado */
.nf-custom-form .nf-select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Cpath fill='%2364748b' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; 
  background-position: right .7rem center !important;
  padding-right: 2rem !important;
}

.nf-custom-form .nf-input:disabled {
  background-color: #f1f5f9 !important; /* Color gris suave */
  color: #94a3b8 !important;            /* Texto atenuado */
  cursor: not-allowed;
  border-color: #cbd5e1 !important;
}

/*VERTICAL */
/* Contenedor alineado a la derecha */
.calc-totales-box {
    width: 100% !important;
    display: flex !important;
    justify-content: flex-end !important;
    padding: 0 !important;
    margin: 0 !important;
    
}

/* Contenedor vertical principal */
.calc-totales-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important; /* Separación milimétrica entre cajas */
    width: 100% !important;
    max-width: 260px !important;
    padding: 1px !important;
    margin: 1px !important;
    margin-right: 12px !important;
}

/* Fila con altura fija estricta */
.calc-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important; 
    justify-content: flex-end !important;
    width: 100% !important;
    height: 38px !important; /* Fuerza a que toda la fila mida solo 24px de alto */
    margin: 0 !important;
    padding: 0 !important;
}

/* Labels: Eliminamos line-height heredados que causaban la separación */
.calc-label {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    text-align: right !important;
    width: 120px !important;
    min-width: 120px !important;
    padding: 0 15px 0 0 !important;
    margin: 0 !important;
    line-height: 1 !important; /* Quita el espacio vertical invisible del texto */
    display: block !important;
}

.calc-currency {
    color: var(--nf-red, #ef4444) !important;
    margin-left: 2px !important;
}

/* Input delgado sin padding vertical */
.calc-input {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 5px !important;
    width: 100% !important;
    height: 35px !important; /* Ocupa exactamente el alto de la fila */
    padding: 0 6px !important; /* 0px arriba/abajo elimina la separación interna */
    margin-top: -8px !important; /* Ajusta el margen superior para alinear verticalmente con el label */
    margin: 0 !important;
    font-size: 0.8rem !important;
    color: #1e293b !important;
    font-family: 'JetBrains Mono', monospace !important;
    text-align: right !important;
    box-sizing: border-box !important;
    pointer-events: auto !important;
    cursor: text !important;
}

.calc-input:focus {
    outline: none !important;
    border-color: #93c5fd !important;
    box-shadow: 0 0 0 2px rgba(37,99,235,.10) !important;
}

/* Estilo destacado del TOTAL */
.calc-row--final .calc-label {
    color: #0f172a !important;
    font-weight: 700 !important;
}
.calc-row--final .calc-input {
    font-weight: 700 !important;
    background: #f8fafc !important;
    border-color: #94a3b8 !important;
}

 /* ---╔══════════════════════════════════════════════════════╗
       ║  ESTILOS EXCLUSIVOS  →  scope: .fv-app(Nueva Factura ║
       ╚══════════════════════════════════════════════════════╝ -->*/
 .fv-app *, .fv-nav * { box-sizing: border-box; }
    .fv-app, .fv-nav { font-family: 'Plus Jakarta Sans', sans-serif; }

    /* ── Variables ── */
    .fv-app {
      --fv-bg:       #f4f6fa;
      --fv-surface:  #ffffff;
      --fv-border:   #e2e8f0;
      --fv-text:     #1e293b;
      --fv-muted:    #64748b;
      --fv-subtle:   #94a3b8;
      --fv-accent:   #2563eb;
      --fv-accent-lt:#eff6ff;
      --fv-green:    #16a34a;
      --fv-green-lt: #f0fdf4;
      --fv-yellow:   #b45309;
      --fv-yellow-lt:#fffbeb;
      --fv-red:      #dc2626;
      --fv-red-lt:   #fef2f2;
      --fv-radius:   10px;
      --fv-shadow:   0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.04);
      --fv-shadow-md:0 4px 14px rgba(0,0,0,.10);
    }

    /* ── Navbar ── */
    .fv-nav {
      background: #fff;
      border-bottom: 1px solid #e2e8f0;
      padding: .85rem 1.5rem;
      display: flex; align-items: center; gap: .8rem;
    }
    .fv-nav__back {
      display: inline-flex; align-items: center; gap: .4rem;
      color: #64748b; font-size: .85rem; text-decoration: none;
      font-family: 'Plus Jakarta Sans', sans-serif;
      transition: color .15s;
    }
    .fv-nav__back:hover { color: #2563eb; text-decoration: none; }
    .fv-nav__sep { color: #cbd5e1; }
    .fv-nav__title {
      font-weight: 700; font-size: 1rem; color: #1e293b;
      font-family: 'Plus Jakarta Sans', sans-serif;
    }
    .fv-nav__id {
      font-family: 'JetBrains Mono', monospace;
      font-size: .75rem; color: #64748b;
      background: #f1f5f9; border-radius: 999px;
      padding: 2px 10px; border: 1px solid #e2e8f0;
    }
    .fv-nav__mode {
      margin-left: auto; display: flex; align-items: center; gap: .5rem;
    }

    /* ── Toggle edit/view ── */
    .fv-toggle {
      display: flex; align-items: center;
      background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 8px;
      padding: 3px; gap: 3px;
    }
    .fv-toggle__btn {
      padding: 5px 14px; border-radius: 6px;
      font-size: .78rem; font-weight: 600;
      cursor: pointer; border: none;
      background: transparent; color: #64748b;
      font-family: 'Plus Jakarta Sans', sans-serif;
      transition: background .15s, color .15s;
    }
    .fv-toggle__btn--active {
      background: #fff; color: #1e293b;
      box-shadow: 0 1px 3px rgba(0,0,0,.10);
    }

    /* ── Save button ── */
    .fv-btn-save {
      display: inline-flex; align-items: center; gap: .4rem;
      background: #2563eb; color: #fff;
      border: none; border-radius: 8px;
      padding: .45rem 1.1rem; font-size: .82rem; font-weight: 600;
      font-family: 'Plus Jakarta Sans', sans-serif;
      cursor: pointer; transition: background .15s;
    }
    .fv-btn-save:hover { background: #1d4ed8; }
    .fv-btn-save:disabled { background: #94a3b8; cursor: not-allowed; }

    /* ── Layout ── */
    .fv-app { background: var(--fv-bg); min-height: 100vh; }
    .fv-wrap { max-width: 1000px; margin: 0 auto; padding: 2rem 1.25rem 4rem; }

    /* ── Loading overlay ── */
    #fv-loading {
      display: flex; align-items: center; justify-content: center;
      min-height: 60vh;
      color: #64748b; font-size: .9rem; flex-direction: column; gap: .7rem;
    }
    .fv-spinner {
      width: 30px; height: 30px;
      border: 2.5px solid #e2e8f0;
      border-top-color: #2563eb;
      border-radius: 50%;
      animation: fv-spin .65s linear infinite;
    }
    @keyframes fv-spin { to { transform:rotate(360deg); } }

    /* ── Card ── */
    .fv-card {
      background: var(--fv-surface);
      border: 1px solid var(--fv-border);
      border-radius: var(--fv-radius);
      box-shadow: var(--fv-shadow);
      margin-bottom: 1.25rem;
      overflow: hidden;
    }
    .fv-card__head {
      padding: .9rem 1.3rem;
      border-bottom: 1px solid var(--fv-border);
      display: flex; align-items: center; justify-content: space-between;
      background: #f8fafc;
    }
    .fv-card__htitle {
      font-weight: 700; font-size: .9rem; color: var(--fv-text);
      display: flex; align-items: center; gap: .5rem;
    }
    .fv-card__htitle i { color: var(--fv-accent); }
    .fv-card__body { padding: 1.3rem; }

    /* ── Info grid (view mode) ── */
    .fv-info-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(200px,1fr));
      gap: 1rem;
    }
    .fv-info-item__label {
      font-size: .69rem; font-weight: 600; text-transform: uppercase;
      letter-spacing: .5px; color: var(--fv-muted); margin-bottom: .2rem;
    }
    .fv-info-item__val {
      font-size: .9rem; color: var(--fv-text); font-weight: 500;
    }
    .fv-info-item__val--mono { font-family: 'JetBrains Mono', monospace; }

    /* ── Proveedor hero ── */
    .fv-prov-hero {
      display: flex; align-items: center; gap: 1rem;
      padding: 1.1rem 1.3rem;
      background: linear-gradient(135deg,#eff6ff 0%,#fff 100%);
      border-bottom: 1px solid var(--fv-border);
    }
    .fv-prov-avatar {
      width: 48px; height: 48px; border-radius: 10px;
      background: linear-gradient(135deg,#3b82f6,#1d4ed8);
      color: #fff; font-weight: 700; font-size: 1rem;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .fv-prov-name  { font-weight: 700; font-size: 1rem; color: var(--fv-text); }
    .fv-prov-meta  { font-size: .78rem; color: var(--fv-muted); margin-top: .1rem; }
    .fv-prov-meta span { margin-right: 1rem; }
    .fv-prov-meta i { margin-right: .3rem; }

    /* ── Status badge big ── */
    .fv-status {
      font-size: .75rem; font-weight: 700;
      font-family: 'JetBrains Mono', monospace;
      border-radius: 999px; padding: 4px 14px; border: 1px solid;
    }
    .fv-status--pagada    { background:#f0fdf4; color:#16a34a; border-color:#bbf7d0; }
    .fv-status--pendiente { background:#fffbeb; color:#b45309; border-color:#fde68a; }
    .fv-status--anulada   { background:#fef2f2; color:#dc2626; border-color:#fecaca; }

    /* ── Form inputs (edit mode) ── */
    .fv-input {
      background: #fff; border: 1px solid #e2e8f0;
      border-radius: 7px; padding: .45rem .7rem;
      font-size: .85rem; color: #1e293b; width: 100%;
      font-family: 'Plus Jakarta Sans', sans-serif;
      transition: border-color .2s, box-shadow .2s;
    }
    .fv-input:focus {
      outline: none; border-color: #93c5fd;
      box-shadow: 0 0 0 3px rgba(37,99,235,.1);
    }
    .fv-input--mono { font-family: 'JetBrains Mono', monospace; }
    .fv-select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Cpath fill='%2364748b' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .6rem center; padding-right: 1.8rem; }

    .fv-label {
      font-size: .7rem; font-weight: 600; text-transform: uppercase;
      letter-spacing: .5px; color: #64748b; margin-bottom: .3rem; display: block;
    }
    .fv-form-grid {
      display: grid; grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); gap: 1rem;
    }

    /* ── Items table ── */
    .fv-items-table {
      width: 100%; border-collapse: collapse; font-size: .82rem;
    }
    .fv-items-table thead th {
      color: #64748b; font-weight: 600; font-size: .69rem;
      text-transform: uppercase; letter-spacing: .5px;
      padding: .45rem .7rem; border-bottom: 2px solid #e2e8f0;
      background: #f8fafc; white-space: nowrap;
    }
    .fv-items-table tbody tr { border-bottom: 1px solid #f1f5f9; }
    .fv-items-table tbody tr:last-child { border-bottom: none; }
    .fv-items-table tbody tr:hover { background: #f8fafc; }
    .fv-items-table tbody td { padding: .6rem .7rem; vertical-align: middle; color: #1e293b; }
    .fv-mono { font-family: 'JetBrains Mono', monospace; }

    /* Input inside table */
    .fv-td-input {
      background: #fff; border: 1px solid #e2e8f0; border-radius: 6px;
      padding: .35rem .5rem; font-size: .8rem; width: 100%;
      font-family: 'Plus Jakarta Sans', sans-serif; color: #1e293b;
    }
    .fv-td-input:focus { outline: none; border-color: #93c5fd; box-shadow: 0 0 0 2px rgba(37,99,235,.1); }

    /* ── Totals row ── */
    .fv-totals {
      padding: 1rem 1.3rem; border-top: 1px solid #e2e8f0;
      display: flex; justify-content: flex-end;
    }
    .fv-totals-grid {
      display: grid; grid-template-columns: auto auto; gap: .3rem 1.5rem;
      text-align: right;
    }
    .fv-totals-label { font-size: .78rem; color: #64748b; font-weight: 500; }
    .fv-totals-value { font-size: .82rem; font-family: 'JetBrains Mono', monospace; color: #1e293b; }
    .fv-totals-total .fv-totals-label { font-size: .9rem; font-weight: 700; color: #1e293b; }
    .fv-totals-total .fv-totals-value { font-size: .95rem; font-weight: 700; color: #2563eb; }

    /* ── Add / Remove row buttons ── */
    .fv-btn-add {
      display: inline-flex; align-items: center; gap: .4rem;
      font-size: .8rem; font-weight: 600; color: #2563eb;
      background: #eff6ff; border: 1px dashed #93c5fd;
      border-radius: 7px; padding: .45rem 1rem; cursor: pointer;
      font-family: 'Plus Jakarta Sans', sans-serif;
      transition: background .15s;
    }
    .fv-btn-add:hover { background: #dbeafe; }

    .fv-btn-del {
      background: none; border: none; color: #ef4444;
      cursor: pointer; padding: 4px; font-size: .85rem;
      border-radius: 5px; transition: background .15s;
    }
    .fv-btn-del:hover { background: #fef2f2; }

    /* ── Notes ── */
    .fv-textarea {
      background: #fff; border: 1px solid #e2e8f0; border-radius: 7px;
      padding: .6rem .8rem; font-size: .85rem; color: #1e293b;
      width: 100%; resize: vertical; min-height: 70px;
      font-family: 'Plus Jakarta Sans', sans-serif;
      transition: border-color .2s, box-shadow .2s;
    }
    .fv-textarea:focus { outline: none; border-color: #93c5fd; box-shadow: 0 0 0 3px rgba(37,99,235,.1); }

    /* ── Toast ── */
    #fv-toasts { position:fixed; bottom:1.5rem; right:1.5rem; z-index:9999; }
    .fv-toast {
      background:#1e293b; color:#f1f5f9; border-radius:8px;
      padding:.7rem 1rem; font-size:.8rem;
      display:flex; align-items:center; gap:.5rem;
      box-shadow:0 8px 24px rgba(0,0,0,.18);
      animation:fv-slideUp .22s ease; margin-top:.45rem;
      font-family:'Plus Jakarta Sans',sans-serif;
    }
    .fv-toast--ok  { border-left:3px solid #22c55e; }
    .fv-toast--err { border-left:3px solid #ef4444; }
    @keyframes fv-slideUp { from{opacity:0;transform:translateY(10px);} to{opacity:1;transform:translateY(0);} }

    /* ── Readonly state ── */
    .fv-app.fv-readonly .fv-td-input,
    .fv-app.fv-readonly .fv-input,
    .fv-app.fv-readonly .fv-textarea,
    .fv-app.fv-readonly .fv-select { pointer-events:none; background:#f8fafc; }
    .fv-app.fv-readonly .fv-btn-del,
    .fv-app.fv-readonly .fv-btn-add,
    .fv-app.fv-readonly #fv-save-btn { display:none; }
    .fv-app:not(.fv-readonly) .fv-view-only { display:none; }
    .fv-app.fv-readonly  .fv-edit-only { display:none; }

    /* ── Voucher section ── */
    .fv-voucher-zone {
      border: 2px dashed #cbd5e1;
      border-radius: 10px;
      padding: 2rem 1.5rem;
      text-align: center;
      cursor: pointer;
      transition: border-color .2s, background .2s;
      background: #f8fafc;
      position: relative;
    }
    .fv-voucher-zone:hover,
    .fv-voucher-zone.drag-over {
      border-color: #93c5fd;
      background: #eff6ff;
    }
    .fv-voucher-zone input[type=file] {
      position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%;
    }
    .fv-voucher-icon {
      width: 48px; height: 48px; border-radius: 10px;
      background: #dbeafe; color: #2563eb;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.3rem; margin: 0 auto .75rem;
    }
    .fv-voucher-title  { font-weight: 600; font-size: .9rem; color: #1e293b; margin-bottom: .25rem; }
    .fv-voucher-sub    { font-size: .78rem; color: #64748b; }

    /* Voucher preview card */
    .fv-voucher-preview {
      display: flex; align-items: center; gap: .9rem;
      background: #f8fafc; border: 1px solid #e2e8f0;
      border-radius: 8px; padding: .75rem 1rem;
    }
    .fv-voucher-preview__icon {
      width: 38px; height: 38px; border-radius: 7px;
      background: #dbeafe; color: #2563eb;
      display: flex; align-items: center; justify-content: center;
      font-size: 1rem; flex-shrink: 0;
    }
    .fv-voucher-preview__name  { font-size: .85rem; font-weight: 600; color: #1e293b; }
    .fv-voucher-preview__meta  { font-size: .72rem; color: #64748b; margin-top: .1rem; }
    .fv-voucher-preview__actions { margin-left: auto; display: flex; gap: .5rem; }

    .fv-btn-voucher-view {
      display: inline-flex; align-items: center; gap: .35rem;
      font-size: .75rem; font-weight: 600; color: #2563eb;
      background: #eff6ff; border: 1px solid #bfdbfe;
      border-radius: 6px; padding: 4px 10px; cursor: pointer;
      text-decoration: none; font-family: 'Plus Jakarta Sans', sans-serif;
      transition: background .15s;
    }
    .fv-btn-voucher-view:hover { background: #dbeafe; text-decoration: none; }

    .fv-btn-voucher-del {
      display: inline-flex; align-items: center; justify-content: center;
      width: 28px; height: 28px;
      background: #fef2f2; border: 1px solid #fecaca; border-radius: 6px;
      color: #ef4444; cursor: pointer; font-size: .75rem;
      font-family: 'Plus Jakarta Sans', sans-serif; transition: background .15s;
    }
    .fv-btn-voucher-del:hover { background: #fee2e2; }

    /* Upload progress */
    .fv-progress-wrap {
      margin-top: .75rem;
      background: #e2e8f0; border-radius: 999px; height: 5px; overflow: hidden;
    }
    .fv-progress-bar {
      height: 100%; background: #2563eb; border-radius: 999px;
      transition: width .3s ease; width: 0%;
    }
    .fv-upload-status { font-size: .75rem; color: #64748b; margin-top: .4rem; }

    /* Readonly: hide upload zone, show only preview */
    .fv-app.fv-readonly .fv-voucher-upload-area { display: none !important; }
    .fv-app:not(.fv-readonly) .fv-voucher-readonly-msg { display: none !important; }

     /* ── Botón nueva factura (+ en card header) ── */
    .fv-btn-add-more {
      display: inline-flex; align-items: center; justify-content: center;
      width: 30px; height: 30px;
      border-radius: 6px;
      background: var(--fv-green-lt);
      color: var(--fv-green);
      border: 1px solid #bbf7d0;
      font-size: .85rem;
      cursor: pointer;
      text-decoration: none;
      transition: background .15s, color .15s, border-color .15s;
      flex-shrink: 0;
    }
    .fv-btn-add-more:hover {
      background: var(--fv-green);
      color: #fff;
      border-color: var(--fv-green);
      text-decoration: none;
    }