/* Basic styling — uses EMCT theme green #10b981 set via localized JS or override in your theme */
.emct-filter-wrapper { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; }
.emct-filter-panel { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px; align-items:center }
.emct-filter-row { flex:1 1 200px; }
.emct-select { width:100%; min-height:40px; padding:8px; border:1px solid #ddd; border-radius:6px }
.emct-search-input { width:100%; padding:10px; border-radius:6px; border:1px solid #ddd }
.emct-filter-btn { background:var(--emct-theme, #10b981); color:#fff; border:none; padding:8px 12px; border-radius:8px; cursor:pointer }
.emct-reset-btn { background:#eee; color:#111 }
.emct-results-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap:12px }
.emct-card { display:block; text-decoration:none; color:inherit; border:1px solid #eee; border-radius:8px; overflow:hidden; background:#fff }
.emct-card-thumb img { width:100%; height:140px; object-fit:cover }
.emct-card-body { padding:10px }
.emct-card-body h3 { margin:0 0 6px 0; font-size:1.05rem }
.emct-card-body p { margin:0 0 8px 0; color:#555; font-size:0.95rem }
.emct-card-meta { display:flex; gap:8px; flex-wrap:wrap }
.emct-card-meta .meta-item { font-size:0.8rem; padding:4px 6px; background:#f6f6f6; border-radius:6px }
.emct-no-results { padding:24px; text-align:center; color:#666 }
.emct-results-footer { text-align:center; margin-top:12px }
.emct-load-more-btn { background:none; border:1px solid #ddd; padding:8px 12px; border-radius:8px }

/* Make sure the theme color variable is set */
:root { --emct-theme: #10b981 }

/* Small responsive tweaks */
@media (max-width:600px) { .emct-filter-panel { flex-direction:column } }