/* ===== INR Literatuur ===== */
/* Alle regels met !important, kleuren via vaste hexes (huisstijl). */

.inr-lit-laden, .inr-lit-leeg { padding: 40px 20px !important; text-align: center !important; color: #64748B !important; font-family: 'Inter', sans-serif !important; font-size: 15px !important; }

/* Kop */
.inr-lit-kop { text-align: center !important; margin: 8px 0 24px !important; }
.inr-lit-titel { font-family: 'Inter', sans-serif !important; font-size: 34px !important; font-weight: 600 !important; color: #0F172A !important; margin: 0 0 6px !important; }
.inr-lit-ondertitel { font-family: 'Inter', sans-serif !important; font-size: 15px !important; font-weight: 300 !important; color: #64748B !important; margin: 0 !important; }

/* Zoek- en sorteerrij */
.inr-lit-zoekrij { max-width: 720px !important; margin: 0 auto 20px !important; display: flex !important; gap: 10px !important; align-items: center !important; flex-wrap: wrap !important; }
.inr-lit-zoek { flex: 1 1 260px !important; box-sizing: border-box !important; padding: 13px 18px !important; border: 1px solid rgba(15,23,42,.14) !important; border-radius: 12px !important; font-family: 'Inter', sans-serif !important; font-size: 15px !important; background: #fff !important; }
.inr-lit-zoek:focus { outline: none !important; border-color: #007BFF !important; box-shadow: 0 0 0 3px rgba(0,123,255,.12) !important; }
.inr-lit-sorteer { display: flex !important; align-items: center !important; gap: 8px !important; flex: 0 0 auto !important; }
.inr-lit-sorteer-label { font-family: 'Inter', sans-serif !important; font-size: 13px !important; font-weight: 500 !important; color: #64748B !important; white-space: nowrap !important; }
.inr-lit-sorteer-select { padding: 11px 14px !important; border: 1px solid rgba(15,23,42,.14) !important; border-radius: 12px !important; font-family: 'Inter', sans-serif !important; font-size: 14px !important; background: #fff !important; cursor: pointer !important; }
.inr-lit-sorteer-select:focus { outline: none !important; border-color: #007BFF !important; box-shadow: 0 0 0 3px rgba(0,123,255,.12) !important; }

/* Beheerbalk */
.inr-lit-beheerbalk { display: flex !important; gap: 10px !important; justify-content: center !important; margin: 0 0 24px !important; flex-wrap: wrap !important; }

/* Knoppen */
.inr-lit-knop { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; padding: 10px 18px !important; border-radius: 10px !important; font-family: 'Inter', sans-serif !important; font-size: 14px !important; font-weight: 600 !important; cursor: pointer !important; border: 1px solid transparent !important; text-decoration: none !important; background: #5B30D6 !important; color: #fff !important; transition: filter .14s ease, transform .14s ease !important; }
.inr-lit-knop:hover { filter: brightness(1.05) !important; transform: translateY(-1px) !important; }
.inr-lit-knop.licht { background: #fff !important; color: #5B30D6 !important; border-color: rgba(91,48,214,.3) !important; }
.inr-lit-knop.vol { background: #5B30D6 !important; color: #fff !important; }
.inr-lit-knop.gevaar { background: #fff !important; color: #D33A3A !important; border-color: rgba(211,58,58,.35) !important; }
.inr-lit-knop.breed { width: 100% !important; box-sizing: border-box !important; margin-top: 10px !important; }

/* Coverwand */
.inr-lit-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important; gap: 22px !important; }
.inr-lit-kaart { padding: 0 !important; border: none !important; background: transparent !important; cursor: pointer !important; }
.inr-lit-cover { display: block !important; border-radius: 10px !important; overflow: hidden !important; background: #2D2A6E !important; box-shadow: 0 6px 18px rgba(15,23,42,.16) !important; aspect-ratio: 2 / 3 !important; transition: transform .15s ease, box-shadow .15s ease !important; }
.inr-lit-kaart:hover .inr-lit-cover { transform: translateY(-4px) !important; box-shadow: 0 14px 30px rgba(15,23,42,.24) !important; }
.inr-lit-cover img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
.inr-lit-cover-leeg { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 100% !important; padding: 16px !important; box-sizing: border-box !important; color: #fff !important; font-family: 'Inter', sans-serif !important; font-size: 14px !important; font-weight: 600 !important; text-align: center !important; }
.inr-lit-cover-leeg.groot { aspect-ratio: 2 / 3 !important; border-radius: 10px !important; }

/* Sterren */
.inr-lit-sterren { display: inline-flex !important; gap: 1px !important; }
.inr-lit-ster { color: #D8DEE9 !important; font-size: 16px !important; line-height: 1 !important; }
.inr-lit-ster.vol { color: #F59E0B !important; }
/* Halve ster: gevulde ster, maar slechts half ingekleurd via een clip. */
.inr-lit-ster.half { position: relative !important; color: #D8DEE9 !important; }
.inr-lit-ster.half::before { content: '★' !important; position: absolute !important; left: 0 !important; top: 0 !important; width: 50% !important; overflow: hidden !important; color: #F59E0B !important; }

/* Overall-rating onder de cover (overzicht) */
.inr-lit-kaart-rating { display: flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; margin-top: 8px !important; }
.inr-lit-kaart-cijfer { font-family: 'Inter', sans-serif !important; font-size: 13px !important; font-weight: 700 !important; color: #334155 !important; }

/* Detailpagina */
.inr-lit-detail-kop { display: flex !important; align-items: center !important; gap: 14px !important; margin-bottom: 20px !important; }
.inr-lit-terug { background: none !important; border: none !important; color: #007BFF !important; font-family: 'Inter', sans-serif !important; font-size: 14px !important; font-weight: 500 !important; cursor: pointer !important; padding: 0 !important; }
.inr-lit-eyebrow { font-family: 'Inter', sans-serif !important; font-size: 12px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .06em !important; color: #94A3B8 !important; }
.inr-lit-detail { display: grid !important; grid-template-columns: 240px 1fr !important; gap: 32px !important; align-items: start !important; }
.inr-lit-detail-cover img { width: 100% !important; border-radius: 12px !important; box-shadow: 0 10px 30px rgba(15,23,42,.2) !important; display: block !important; }
.inr-lit-detail-titel { font-family: 'Inter', sans-serif !important; font-size: 28px !important; font-weight: 600 !important; color: #0F172A !important; margin: 0 0 4px !important; }
.inr-lit-detail-auteur { font-family: 'Inter', sans-serif !important; font-size: 16px !important; color: #64748B !important; margin-bottom: 22px !important; }
.inr-lit-sectie { margin-bottom: 20px !important; }
.inr-lit-sectie-kop { font-family: 'Inter', sans-serif !important; font-size: 16px !important; font-weight: 600 !important; color: #0F172A !important; margin: 0 0 6px !important; }
.inr-lit-sectie-tekst { font-family: 'Inter', sans-serif !important; font-size: 15px !important; font-weight: 300 !important; line-height: 1.6 !important; color: #334155 !important; margin: 0 !important; }

/* Ratings (detail) */
.inr-lit-ratings { margin-top: 26px !important; border-top: 1px solid rgba(15,23,42,.08) !important; padding-top: 20px !important; }
.inr-lit-rating { margin-bottom: 16px !important; }
.inr-lit-rating-kop { display: flex !important; align-items: center !important; gap: 10px !important; margin-bottom: 3px !important; }
.inr-lit-rating-naam { font-family: 'Inter', sans-serif !important; font-size: 14.5px !important; font-weight: 600 !important; color: #0F172A !important; }
.inr-lit-rating-tekst { font-family: 'Inter', sans-serif !important; font-size: 13.5px !important; font-weight: 300 !important; line-height: 1.5 !important; color: #64748B !important; }

/* Formulier (beheer) */
.inr-lit-form { max-width: 680px !important; }
.inr-lit-uitleg { font-family: 'Inter', sans-serif !important; font-size: 14px !important; color: #64748B !important; margin: 0 0 18px !important; }
.inr-lit-veld { margin-bottom: 18px !important; }
.inr-lit-label { display: block !important; font-family: 'Inter', sans-serif !important; font-size: 13px !important; font-weight: 600 !important; color: #334155 !important; margin-bottom: 6px !important; }
.inr-lit-input, .inr-lit-textarea { width: 100% !important; box-sizing: border-box !important; padding: 10px 14px !important; border: 1px solid rgba(15,23,42,.14) !important; border-radius: 10px !important; font-family: 'Inter', sans-serif !important; font-size: 14.5px !important; background: #fff !important; }
.inr-lit-input:focus, .inr-lit-textarea:focus { outline: none !important; border-color: #007BFF !important; box-shadow: 0 0 0 3px rgba(0,123,255,.1) !important; }
.inr-lit-textarea { resize: vertical !important; line-height: 1.5 !important; }
.inr-lit-cover-bewerk { display: flex !important; gap: 16px !important; align-items: flex-start !important; }
.inr-lit-cover-prev { width: 90px !important; flex-shrink: 0 !important; border-radius: 8px !important; overflow: hidden !important; background: #2D2A6E !important; aspect-ratio: 2 / 3 !important; }
.inr-lit-cover-prev img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
.inr-lit-cover-acties { flex: 1 1 auto !important; display: flex !important; flex-direction: column !important; gap: 10px !important; }

/* Ratings (bewerk) */
.inr-lit-ratings-bewerk { display: flex !important; flex-direction: column !important; gap: 14px !important; }
.inr-lit-rating-bewerk { background: #F8FAFC !important; border: 1px solid rgba(15,23,42,.08) !important; border-radius: 12px !important; padding: 14px 16px !important; }
.inr-lit-rating-bewerk-kop { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; margin-bottom: 8px !important; }
.inr-lit-ster-kies { display: inline-flex !important; gap: 2px !important; }
.inr-lit-ster-knop { background: none !important; border: none !important; cursor: pointer !important; font-size: 22px !important; line-height: 1 !important; color: #D8DEE9 !important; padding: 0 !important; }
.inr-lit-ster-knop.vol { color: #F59E0B !important; }

/* Dimensie-beheer */
.inr-lit-dim-lijst { display: flex !important; flex-direction: column !important; gap: 10px !important; margin-bottom: 14px !important; }
.inr-lit-dim-rij { display: flex !important; gap: 8px !important; align-items: center !important; }
.inr-lit-dim-rij .inr-lit-input { flex: 1 1 auto !important; }
.inr-lit-mini { background: none !important; border: 1px solid rgba(15,23,42,.12) !important; border-radius: 8px !important; padding: 8px 10px !important; cursor: pointer !important; font-size: 14px !important; }
.inr-lit-mini.gevaar { color: #D33A3A !important; border-color: rgba(211,58,58,.3) !important; }

/* Form-acties */
.inr-lit-form-acties { display: flex !important; align-items: center !important; gap: 12px !important; margin-top: 22px !important; flex-wrap: wrap !important; }
.inr-lit-melding { font-family: 'Inter', sans-serif !important; font-size: 13px !important; color: #64748B !important; }

/* Smal scherm */
@media (max-width: 640px) {
  .inr-lit-detail { grid-template-columns: 1fr !important; }
  .inr-lit-detail-cover { max-width: 200px !important; margin: 0 auto !important; }
}
