/* NPL Report List/View - component scoped styles */
.nplr, .nplr * { box-sizing: border-box; }
.nplr a { text-decoration: none; color: inherit; }

.nplr-wrap { max-width: 1200px; margin: 0 auto; padding: 8px 12px; }
.nplr-title { font-size: 30px; font-weight: 800; margin: 6px 0 14px; }

/* search bar */
.nplr-search { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0 18px; padding-top:50px;}
.nplr-search .inp { min-width: 200px; padding: 8px 10px; border: 1px solid #ddd; border-radius: 8px; }
.nplr-search .btn { padding: 8px 14px; border: 1px solid #222; background:#222; color:#fff; border-radius: 8px; }

/* grid */
.nplr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px,1fr)); gap: 18px; padding-top:50px;}
@media (max-width: 480px) { .nplr-grid { gap: 12px; } }

/* card */
.nplr-card { display: block; background:#fff; border:1px solid #eee; border-radius: 12px; overflow: hidden; transition: transform .15s ease, box-shadow .15s ease; }
.nplr-card:hover { transform: translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.06); }

.nplr-thumb { position: relative; background: #f6f7f9; }
.nplr-thumb::before { content:""; display:block; padding-top: 56%; } /* 16:9 fallback */
.nplr-thumb > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
@supports (aspect-ratio: 16/9) {
  .nplr-thumb { aspect-ratio: 16/9; }
  .nplr-thumb::before { display:none; padding:0; }
}

.nplr-body { padding:14px; }
.nplr-h3 { font-size:17px; font-weight:700; margin:0 0 6px; line-height:1.35; }
.nplr-summary { font-size:14px; color:#666; line-height:1.55; height: 44px; overflow: hidden; }
.nplr-meta { padding: 8px 14px 14px; color:#999; font-size:12px; }

/* view page bits (optional, if you add link in view.php) */
.nplr-view-head { display:flex; gap:16px; align-items:flex-start; margin:8px 0 16px; }
.nplr-cover { width:180px; flex:0 0 180px; border:1px solid #eee; border-radius:8px; overflow:hidden; background:#fafafa; }
.nplr-cover img { width:100%; height:auto; display:block; }
.nplr-view-title { font-size:24px; font-weight:800; margin:0; }
@media(max-width:640px){ .nplr-view-head{flex-direction:column} .nplr-cover{width:100%; max-width:420px} .nplr-view-title{font-size:20px} }

.nplr-actions { margin-top:10px; display:flex; gap:8px; flex-wrap:wrap; }
.nplr-actions .btn { border:1px solid #ddd; padding:8px 12px; border-radius:8px; background:#fff; }
.nplr-content { margin-top:16px; line-height:1.7; background:#fff; border:1px solid #eee; border-radius:12px; padding:18px; }


.nplr-thumb { position: relative; }
.nplr-badge { position: absolute; right: 8px; top: 8px; padding: 4px 8px; font-size: 12px; border-radius: 6px; }
.nplr-badge-lock { background: rgba(0,0,0,.7); color: #fff; }