/* Minimal local site.css fallback created because `npm install` could not fetch tailwind packages
   This file prevents a 404 for /css/site.css and contains a small set of utility styles
   used by the admin views. It is intentionally small — replace with a full Tailwind build
   when npm install + npm run build:css succeed in your environment.
*/
:root { --bs-primary: #0d6efd; --bs-secondary: #6c757d; }
html,body{ font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; color:#111827; }
.tw-btn-primary{ background-color: #2563eb; color:#fff; padding:.4rem .75rem; border-radius:.375rem; display:inline-flex; align-items:center; gap:.5rem; border: none; }
.tw-btn-primary:hover{ background-color:#1d4ed8 }
.tw-btn-secondary{ background-color:#e5e7eb; color:#111827; padding:.35rem .65rem; border-radius:.375rem; display:inline-flex; align-items:center; gap:.4rem; border: none; }
.tw-form-input{ display:block; width:100%; padding:.5rem .75rem; border:1px solid #d1d5db; border-radius:.375rem; box-sizing:border-box; }
.tw-card{ background:#fff; border-radius:.5rem; padding:1rem; box-shadow:0 1px 2px rgba(0,0,0,.05); }
.tw-list-item-success{ background-color:#6af19a; }
.tw-list-item-warning{ background-color:#e6e6e6; }
.tw-modal-overlay{ position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 1050; display:flex; align-items:center; justify-content:center; }
.tw-modal-content{ background:#fff; border-radius:.5rem; padding:1rem; max-width:480px; width:100%; }

/* Selected/active list item override (admin left-hand list) */
/* Use a soft blue highlight for active selection to improve contrast and readability. */
#entryList .list-group-item.active,
#entryList .list-group-item.active:hover {
   background-color: #bfdbfe !important; /* Tailwind blue-200 */
   color: #0f172a !important; /* slate-900 */
}

/* Ensure text inside stays readable */
#entryList .list-group-item.active small { color: #0f172a !important; }

/* If an item is marked 'success' (aanwezig) prefer a green background even when active.
   Use specific selectors to override the generic active rule above. */
#entryList .list-group-item.list-group-item-success,
#entryList .list-group-item.list-group-item-success:hover,
#entryList .list-group-item.list-group-item-success.active,
#entryList .list-group-item.list-group-item-success.active:hover {
   background-color: #6af19a !important; /* success-ish green (matches .tw-list-item-success) */
   color: #052e16 !important; /* dark text for contrast */
}
#entryList .list-group-item.list-group-item-success small { color: #052e16 !important; }

/* small responsive helpers */
@media (min-width: 768px){ .md-col-6{ width:50%; float:left; box-sizing:border-box; } }

/* Optional information fieldset styling used on public pages (home/embed) */
.optional-info { border: 1px solid #d1d5db; background-color: #f3f4f6; }
.optional-info-legend {
   font-size: .9rem;
   padding: 0 .5rem;
   margin-left: .5rem;
   margin-bottom: 0.25rem;
   color: #374151;
   font-weight: 600;
}

/* Tweak default fieldset legend placement for a small 'title on the border' look */
fieldset.optional-info { position: relative; padding-top: 0.9rem; }
fieldset.optional-info legend { position: absolute; top: -0.6rem; left: 0.75rem; background: #f3f4f6; }