/**
 * NB Organisation & Event Manager - minimal front-end styling.
 *
 * Deliberately light-touch: this plugin ships semantic, predictably
 * classed markup (all classes prefixed nb-) so a theme/designer can take
 * over styling later. This stylesheet only provides enough layout to be
 * usable out of the box.
 */

.nb-org-events {
	box-sizing: border-box;
}
.nb-org-events *,
.nb-org-events *::before,
.nb-org-events *::after {
	box-sizing: inherit;
}

/* Notices */
.nb-notice {
	padding: 0.75em 1em;
	margin: 0 0 1.5em;
	border-left: 4px solid #888;
	background: #f5f5f5;
}
.nb-notice--success { border-color: #2a8; background: #eafaf2; }
.nb-notice--error { border-color: #c33; background: #fdecec; }
.nb-notice--info { border-color: #37a; background: #eaf2fb; }

/* Forms */
.nb-form { max-width: 640px; }
.nb-form__row {
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
}
.nb-form__row .nb-field { flex: 1 1 200px; }
.nb-field { margin: 0 0 1.25em; }
.nb-field__label { display: block; font-weight: 600; margin-bottom: 0.35em; }
.nb-field__input,
.nb-field__textarea {
	width: 100%;
	padding: 0.5em 0.6em;
	border: 1px solid #ccc;
	border-radius: 3px;
	font: inherit;
}
.nb-field__textarea { resize: vertical; }
.nb-field__hint { margin: 0.35em 0 0; font-size: 0.85em; color: #666; }
.nb-field--submit { margin-top: 1.5em; }
.nb-required { color: #c33; }
.nb-field__current-logo { display: block; margin-bottom: 0.5em; border-radius: 3px; }

/* Location autocomplete */
.nb-location-field { position: relative; }
.nb-location-field__results {
	position: absolute;
	z-index: 20;
	top: 100%;
	left: 0;
	right: 0;
	margin: 2px 0 0;
	padding: 0.25em 0;
	list-style: none;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 3px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
	max-height: 260px;
	overflow-y: auto;
}
.nb-location-field__results[hidden] { display: none; }
.nb-location-field__result { padding: 0.5em 0.75em; cursor: pointer; }
.nb-location-field__result:hover,
.nb-location-field__result.is-active { background: #eef3fb; }

/* Buttons */
.nb-btn {
	display: inline-block;
	padding: 0.6em 1.25em;
	border: 1px solid transparent;
	border-radius: 3px;
	font: inherit;
	cursor: pointer;
	text-decoration: none;
	background: #eee;
	color: #222;
}
.nb-btn--primary { background: #2c3e50; color: #fff; }
.nb-btn--secondary { background: #fff; border-color: #2c3e50; color: #2c3e50; }
.nb-btn--text { background: none; border: none; padding: 0.6em 0.25em; color: #37a; }
.nb-btn--small { padding: 0.3em 0.75em; font-size: 0.85em; }
/* .nb-btn sets its own `display`, which otherwise ties in specificity
 * with the [hidden] UA rule and can lose the cascade - same fix as
 * .nb-location-field__results[hidden] below. */
.nb-btn[hidden] { display: none; }

/* Dashboard */
.nb-dashboard__section { margin: 0 0 2.5em; padding-bottom: 2em; border-bottom: 1px solid #e2e2e2; }
.nb-dashboard__section-header { display: flex; align-items: center; justify-content: space-between; gap: 1em; flex-wrap: wrap; }
.nb-toggle-panel.is-hidden { display: none; }
.nb-profile-summary { display: flex; gap: 1.5em; align-items: flex-start; margin: 1em 0; }
.nb-profile-summary__logo { border-radius: 4px; }
.nb-profile-summary__details { display: grid; grid-template-columns: max-content 1fr; gap: 0.35em 1em; margin: 0; }
.nb-profile-summary__details dt { font-weight: 600; color: #555; }
.nb-profile-summary__details dd { margin: 0; }
.nb-dashboard__logout { margin-top: 2em; }

/* Status badges */
.nb-status { display: inline-block; padding: 0.15em 0.6em; border-radius: 12px; font-size: 0.8em; font-weight: 600; background: #eee; }
.nb-status--publish { background: #d9f5e3; color: #146c34; }
.nb-status--pending { background: #fdf3d8; color: #8a6403; }
.nb-status--nb_rejected { background: #fbe0e0; color: #922; }
.nb-status--draft { background: #eee; color: #555; }

/* Tables */
.nb-table-wrap { overflow-x: auto; }
.nb-table { width: 100%; border-collapse: collapse; }
.nb-table th,
.nb-table td { text-align: left; padding: 0.6em 0.75em; border-bottom: 1px solid #e2e2e2; vertical-align: top; }
.nb-table__note { margin: 0.3em 0 0; font-size: 0.85em; color: #922; }

.nb-empty { color: #666; font-style: italic; }

/* Directory listings */
.nb-breadcrumbs { font-size: 0.9em; color: #666; }
.nb-breadcrumbs a { color: inherit; }
.nb-country-list,
.nb-city-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.75em; }
.nb-country-list__item a,
.nb-city-list__item a {
	display: block;
	padding: 0.6em 1.1em;
	background: #f5f5f5;
	border-radius: 4px;
	text-decoration: none;
}

.nb-city-group { margin: 0 0 2em; }
.nb-city-group__title { margin-bottom: 0.75em; }
.nb-org-grid,
.nb-event-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 1em;
}
.nb-org-card__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5em;
	padding: 1em;
	background: #f9f9f9;
	border-radius: 4px;
	text-decoration: none;
	text-align: center;
	color: inherit;
}
.nb-org-card__logo { border-radius: 4px; object-fit: cover; }
.nb-org-card__logo--placeholder { width: 80px; height: 80px; background: #e2e2e2; border-radius: 4px; }

.nb-event-card { background: #f9f9f9; border-radius: 4px; overflow: hidden; }
.nb-event-card__body { padding: 0.9em 1em; }
.nb-event-card__title { display: block; font-weight: 600; text-decoration: none; margin-bottom: 0.3em; }
.nb-event-card__meta { margin: 0; font-size: 0.9em; color: #555; }
.nb-event-card__org { margin: 0.3em 0 0; font-size: 0.85em; color: #777; }

.nb-event-list { list-style: none; margin: 0; padding: 0; }
.nb-event-list__item { display: flex; justify-content: space-between; gap: 1em; padding: 0.6em 0; border-bottom: 1px solid #eee; }

/* Tabs */
.nb-tabs__nav { display: flex; gap: 0.5em; margin-bottom: 1em; border-bottom: 1px solid #ddd; }
.nb-tabs__btn { background: none; border: none; border-bottom: 2px solid transparent; padding: 0.6em 0.2em; margin-right: 1em; cursor: pointer; font: inherit; color: #555; }
.nb-tabs__btn.is-active { border-bottom-color: #2c3e50; color: #2c3e50; font-weight: 600; }
.nb-tabs__panel.is-hidden { display: none; }

/* Flyer thumbnail + lightbox */
.nb-flyer-thumb { display: inline-block; position: relative; text-decoration: none; }
.nb-flyer-thumb img { display: block; max-width: 100%; height: auto; border-radius: 4px; }
.nb-flyer-thumb__hint { display: block; font-size: 0.8em; color: #666; margin-top: 0.3em; }

/* Flyer lightbox styles itself inline - see assets/js/nb-lightbox.js. */

.nb-qr-code { margin: 1.5em 0; }
.nb-qr-code img { display: block; border-radius: 4px; }
.nb-qr-code__actions { margin: 0.5em 0 0; }

/* Single org / event */
.nb-single-org__header,
.nb-single-event__header { display: flex; align-items: center; gap: 1em; margin: 1em 0; }
.nb-single-org__logo { border-radius: 4px; }
.nb-single-org__details,
.nb-single-event__details { display: grid; grid-template-columns: max-content 1fr; gap: 0.5em 1.5em; margin: 1.5em 0; max-width: 640px; }
.nb-single-org__details dt,
.nb-single-event__details dt { font-weight: 600; color: #555; }
.nb-single-org__details dd,
.nb-single-event__details dd { margin: 0; }
.nb-single-event__flyer { max-width: 400px; margin: 1em 0; }
.nb-single-event__org { color: #555; margin-top: 0.25em; }
.nb-single-event__org-link { margin: 1.5em 0; }

.nb-not-found { padding: 3em 0; text-align: center; color: #666; }

/* [nb_organisations_list] / [nb_events_list] shortcode listings */
.nb-listing__filters {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 1em;
	margin-bottom: 1.25em;
}
.nb-listing__filters .nb-location-field { flex: 1 1 260px; margin-bottom: 0; }
.nb-listing__date-range { flex: 2 1 320px; margin: 0; }
.nb-listing__filters [data-nb-listing-clear] { flex: 0 0 auto; }
.nb-listing__meta { color: #555; font-size: 0.9em; margin: 0 0 1em; }
.nb-listing.is-loading .nb-listing__results { opacity: 0.5; pointer-events: none; }
.nb-org-card__location { font-size: 0.85em; color: #666; }
.nb-listing__pagination { margin-top: 1.5em; text-align: center; }