/* Nota interna del paciente en Ventas y Optometría (js/modules/nota-paciente.js). */
.npi { margin: 8px 0 12px; }
.npi-agregar {
    display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px;
    border: 0; border-radius: 8px; background: transparent; color: #64748b;
    font-size: .78rem; font-weight: 600; cursor: pointer;
}
.npi-agregar:hover { color: #92400e; background: rgba(245, 158, 11, .1); }
.npi-agregar .material-symbols-outlined { font-size: 17px; }
.npi-tarjeta {
    display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px; padding: 11px 13px;
    border: 1px solid rgba(217, 119, 6, .3); border-radius: 12px;
    background: rgba(254, 243, 199, .55); color: #451a03;
}
.npi-icono { color: #b45309; font-size: 20px; }
.npi-texto { flex: 1 1 220px; min-width: 0; display: block; }
.npi-texto strong { display: block; font-size: .8rem; font-weight: 800; }
.npi-texto p { margin: 3px 0; font-size: .88rem; line-height: 1.4; white-space: pre-wrap; overflow-wrap: anywhere; }
.npi-texto small { color: #92400e; font-size: .7rem; }
.npi-texto textarea {
    width: 100%; box-sizing: border-box; margin-top: 6px; padding: 8px 10px; resize: vertical;
    border: 1px solid rgba(217, 119, 6, .4); border-radius: 9px;
    background: rgba(255, 255, 255, .7); color: inherit; font: inherit; font-size: .88rem;
}
.npi-acciones { display: flex; flex-wrap: wrap; gap: 6px; }
.npi-acciones button {
    display: inline-flex; align-items: center; gap: 4px; padding: 6px 10px;
    border: 1px solid rgba(180, 83, 9, .3); border-radius: 9px; background: rgba(255, 255, 255, .6);
    color: #78350f; font-size: .74rem; font-weight: 700; cursor: pointer;
}
.npi-acciones button .material-symbols-outlined { font-size: 15px; }
.npi-acciones .npi-guardar { background: #b45309; border-color: #b45309; color: #fff; }
.npi-acciones button:disabled { opacity: .6; cursor: wait; }
[data-theme="dark"] .npi-tarjeta { background: rgba(120, 53, 15, .3); border-color: rgba(251, 191, 36, .3); color: #fef3c7; }
[data-theme="dark"] .npi-icono, [data-theme="dark"] .npi-texto small { color: #fcd34d; }
[data-theme="dark"] .npi-texto textarea { background: rgba(15, 23, 42, .5); }
[data-theme="dark"] .npi-acciones button { background: rgba(15, 23, 42, .4); color: #fde68a; border-color: rgba(251, 191, 36, .3); }
[data-theme="dark"] .npi-acciones .npi-guardar { background: #d97706; color: #fff; }
[data-theme="dark"] .npi-agregar { color: #94a3b8; }