/*
 * Committee Search Widget – Stylesheet
 * RTL-first, mobile-first, no external dependencies.
 * ------------------------------------------------------------------ */

/* ── Reset & Container ─────────────────────────────────────────────── */
.gcs-widget *,
.gcs-widget *::before,
.gcs-widget *::after {
	box-sizing: border-box;
}

.gcs-widget {
	direction: rtl;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue",
		Arial, "Noto Sans Hebrew", "Arial Hebrew", sans-serif;
	font-size: 16px;
	line-height: 1.6;
	color: #1a1a1a;
	max-width: 720px;
	margin: 0 auto 2rem;
	padding: 0;
}

/* ── Title & Subtitle ──────────────────────────────────────────────── */
.gcs-title {
	font-size: 1.5rem;
	font-weight: 600;
	margin: 0 0 0.5rem;
	color: #1a1a1a;
}

.gcs-subtitle {
	font-size: 0.9rem;
	color: #555;
	margin: 0 0 1rem;
}

/* ── Search row ────────────────────────────────────────────────────── */
.gcs-search-row {
	display: flex;
	gap: 8px;
	margin-bottom: 0.25rem;
}

.gcs-input {
	flex: 1;
	height: 44px;
	padding: 0 14px;
	border: 1.5px solid #c8c8c8;
	border-radius: 8px;
	font-size: 15px;
	font-family: inherit;
	color: #1a1a1a;
	background: #fff;
	outline: none;
	transition: border-color 0.15s;
	direction: rtl;
}

.gcs-input:focus {
	border-color: #0073aa;
	box-shadow: 0 0 0 3px rgba(0, 115, 170, 0.15);
}

.gcs-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 44px;
	padding: 0 18px;
	background: #0073aa;
	color: #fff;
	border: none;
	border-radius: 8px;
	font-size: 15px;
	font-family: inherit;
	font-weight: 500;
	cursor: pointer;
	transition: background 0.15s;
	white-space: nowrap;
}

.gcs-btn:hover  { background: #005a87; }
.gcs-btn:active { background: #004870; transform: scale(0.98); }
.gcs-btn:focus-visible {
	outline: 3px solid #0073aa;
	outline-offset: 2px;
}

/* ── Suggestions dropdown ──────────────────────────────────────────── */
.gcs-suggestions {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1.5px solid #c8c8c8;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 4px 16px rgba(0,0,0,0.10);
	overflow: hidden;
	position: relative;
	z-index: 100;
}

.gcs-sug-item {
	display: flex;
	flex-direction: column;
	padding: 10px 14px;
	cursor: pointer;
	border-bottom: 1px solid #f0f0f0;
	transition: background 0.1s;
}

.gcs-sug-item:last-child    { border-bottom: none; }
.gcs-sug-item:hover,
.gcs-sug-item--active       { background: #f0f7fb; }

.gcs-sug-city {
	font-weight: 600;
	font-size: 14px;
	color: #1a1a1a;
}

.gcs-sug-name {
	font-size: 12px;
	color: #777;
	margin-top: 1px;
}

/* ── Hint ──────────────────────────────────────────────────────────── */
.gcs-hint {
	font-size: 13px;
	color: #888;
	text-align: center;
	margin: 1.5rem 0 0;
	padding: 1rem;
	border: 1px dashed #ddd;
	border-radius: 8px;
}

/* ── Loading / Error / No results ─────────────────────────────────── */
.gcs-loading,
.gcs-error {
	font-size: 14px;
	color: #555;
	padding: 1rem 0;
	text-align: center;
}

.gcs-error { color: #c0392b; }

.gcs-no-results {
	text-align: center;
	padding: 1.5rem;
	color: #555;
	font-size: 14px;
}

.gcs-no-results p  { margin: 0 0 0.75rem; }

/* ── Card ──────────────────────────────────────────────────────────── */
.gcs-card {
	border: 1px solid #e0e0e0;
	border-radius: 12px;
	padding: 1.25rem 1.5rem;
	margin-bottom: 1rem;
	background: #fff;
}

.gcs-card-header { margin-bottom: 0.75rem; }

.gcs-card-name {
	font-size: 1.05rem;
	font-weight: 600;
	margin: 0 0 8px;
	color: #1a1a1a;
}

/* ── Badges ────────────────────────────────────────────────────────── */
.gcs-badge-row {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 0.25rem;
}

.gcs-badge {
	display: inline-block;
	font-size: 12px;
	font-weight: 500;
	padding: 3px 10px;
	border-radius: 20px;
}

.gcs-badge--עצמאית { background: #e8f5e9; color: #2e7d32; }
.gcs-badge--מקומית  { background: #e3f2fd; color: #1565c0; }
.gcs-badge--מרחבית  { background: #fff8e1; color: #f57f17; }
.gcs-badge--open    { background: #e8f5e9; color: #2e7d32; }
.gcs-badge--closed  { background: #f5f5f5; color: #757575; }

/* ── Detail grid ───────────────────────────────────────────────────── */
.gcs-details {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin: 0.75rem 0;
}

.gcs-detail-item {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

/* span full width for hours row */
.gcs-detail-item:nth-child(3) { grid-column: span 2; }

.gcs-detail-label {
	font-size: 12px;
	color: #888;
}

.gcs-detail-value {
	font-size: 14px;
	color: #1a1a1a;
}

.gcs-detail-link {
	color: #0073aa;
	text-decoration: none;
}
.gcs-detail-link:hover { text-decoration: underline; }

/* ── Divider ───────────────────────────────────────────────────────── */
.gcs-divider {
	border: none;
	border-top: 1px solid #f0f0f0;
	margin: 0.75rem 0;
}

/* ── Cities ────────────────────────────────────────────────────────── */
.gcs-cities-wrap { margin-bottom: 0.75rem; }

.gcs-cities-label {
	font-size: 12px;
	color: #888;
	margin: 0 0 6px;
}

.gcs-city-tags {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
}

.gcs-city-tag {
	font-size: 12px;
	padding: 3px 10px;
	border-radius: 20px;
	background: #f5f5f5;
	color: #555;
	border: 1px solid #e8e8e8;
}

/* ── Action buttons ────────────────────────────────────────────────── */
.gcs-actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.gcs-action-btn {
	display: inline-block;
	font-size: 13px;
	padding: 7px 16px;
	border-radius: 8px;
	text-decoration: none;
	font-family: inherit;
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
	border: 1.5px solid #c8c8c8;
	color: #333;
	background: #fff;
}

.gcs-action-btn:hover {
	background: #f5f5f5;
	border-color: #aaa;
	color: #000;
}

.gcs-link-mavat {
	color: #0073aa;
	font-size: 13px;
}
.gcs-link-mavat:hover { text-decoration: underline; }

/* ── Responsive ────────────────────────────────────────────────────── */
@media ( max-width: 480px ) {
	.gcs-details {
		grid-template-columns: 1fr;
	}

	.gcs-detail-item:nth-child(3) {
		grid-column: span 1;
	}

	.gcs-btn span { display: none; }

	.gcs-card { padding: 1rem; }

	.gcs-search-row { flex-wrap: nowrap; }
}

/* ── Dark mode ─────────────────────────────────────────────────────── */
@media ( prefers-color-scheme: dark ) {
	.gcs-widget       { color: #e8e8e8; }
	.gcs-title        { color: #e8e8e8; }
	.gcs-subtitle     { color: #aaa; }
	.gcs-input        { background: #2a2a2a; border-color: #444; color: #e8e8e8; }
	.gcs-input:focus  { border-color: #58a6d6; box-shadow: 0 0 0 3px rgba(88,166,214,.2); }
	.gcs-btn          { background: #0085c7; }
	.gcs-btn:hover    { background: #006fa8; }
	.gcs-card         { background: #1e1e1e; border-color: #333; }
	.gcs-card-name    { color: #e8e8e8; }
	.gcs-detail-value { color: #ddd; }
	.gcs-detail-label { color: #999; }
	.gcs-city-tag     { background: #2a2a2a; color: #bbb; border-color: #3a3a3a; }
	.gcs-hint         { color: #777; border-color: #333; }
	.gcs-sug-item     { background: #1e1e1e; border-color: #333; }
	.gcs-sug-item:hover,
	.gcs-sug-item--active { background: #2a2a2a; }
	.gcs-sug-city     { color: #e8e8e8; }
	.gcs-sug-name     { color: #999; }
	.gcs-suggestions  { background: #1e1e1e; border-color: #333; }
	.gcs-action-btn   { background: #2a2a2a; border-color: #444; color: #ccc; }
	.gcs-action-btn:hover { background: #333; color: #fff; }
	.gcs-divider      { border-color: #333; }
	.gcs-detail-link  { color: #58a6d6; }
}