/* FutureBeef Contacts Directory — every rule forced with !important so Elementor
   cannot override it. Sits inside an existing container, so no outer width/padding. */
:root {
	--fbc-navy: #1e2b50 !important;
	--fbc-navy-d: #16203c !important;
	--fbc-red: #8c0c05 !important;
	--fbc-border: #e7e9ef !important;
	--fbc-muted: #6b7280 !important;
	--fbc-bg: #f7f9fc !important;
}

.fb-contacts {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	color: #1d2327 !important;
	font-size: 14px !important;
	box-sizing: border-box !important;
}
.fb-contacts *, .fb-contacts *::before, .fb-contacts *::after { box-sizing: border-box !important; }

/* ---------- Controls ---------- */
.fb-c-controls { margin: 0 0 20px !important; padding: 0 !important; }
.fb-c-row { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; align-items: flex-end !important; margin: 0 0 12px !important; padding: 0 !important; }
.fb-c-row--top { align-items: center !important; }

.fb-c-search { flex: 1 1 260px !important; }
.fb-c-search input {
	width: 100% !important; min-height: 46px !important; padding: 10px 14px !important;
	border: 1px solid var(--fbc-border) !important; border-radius: 10px !important;
	font-size: 15px !important; font-family: inherit !important; background: #fff !important;
	-webkit-appearance: none !important; appearance: none !important;
}
.fb-c-search input:focus { outline: none !important; border-color: var(--fbc-navy) !important; box-shadow: 0 0 0 2px rgba(30,43,80,.15) !important; }

.fb-c-toggle { display: inline-flex !important; border: 1px solid var(--fbc-border) !important; border-radius: 10px !important; overflow: hidden !important; }
.fb-c-toggle-btn {
	background: #fff !important; border: 0 !important; padding: 11px 20px !important; font-size: 14px !important; font-weight: 600 !important;
	color: var(--fbc-navy) !important; cursor: pointer !important; min-height: 46px !important;
}
.fb-c-toggle-btn.is-active { background: var(--fbc-navy) !important; color: #fff !important; }

.fb-c-field { display: flex !important; flex-direction: column !important; gap: 4px !important; flex: 1 1 180px !important; font-size: 12px !important; font-weight: 600 !important; color: var(--fbc-muted) !important; }
.fb-c-field select {
	min-height: 44px !important; padding: 8px 12px !important; border: 1px solid var(--fbc-border) !important; border-radius: 8px !important;
	font-size: 14px !important; font-weight: 500 !important; color: var(--fbc-navy) !important; background: #fff !important; font-family: inherit !important; cursor: pointer !important;
}
.fb-c-field select:disabled { background: #f1f2f5 !important; color: #aab !important; cursor: default !important; }

.fb-c-clear {
	align-self: flex-end !important; background: none !important; border: 1px solid var(--fbc-border) !important; color: var(--fbc-muted) !important;
	padding: 10px 16px !important; border-radius: 8px !important; font-size: 13px !important; font-weight: 600 !important; cursor: pointer !important; min-height: 44px !important;
}
.fb-c-clear:hover { border-color: var(--fbc-red) !important; color: var(--fbc-red) !important; }

/* A–Z */
.fb-c-az { gap: 4px !important; }
.fb-c-letter {
	min-width: 34px !important; min-height: 34px !important; padding: 4px 8px !important; border: 1px solid var(--fbc-border) !important;
	background: #fff !important; color: var(--fbc-navy) !important; border-radius: 7px !important; font-size: 13px !important; font-weight: 600 !important; cursor: pointer !important;
}
.fb-c-letter:hover { border-color: var(--fbc-navy) !important; }
.fb-c-letter.is-active { background: var(--fbc-navy) !important; color: #fff !important; border-color: var(--fbc-navy) !important; }

.fb-c-count { font-size: 12px !important; color: var(--fbc-muted) !important; margin: 4px 0 0 !important; }

/* ---------- Cards ---------- */
.fb-c-list {
	display: grid !important; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important; gap: 20px !important;
}
/* Cap at 4 across on desktop */
@media (min-width: 1100px) {
	.fb-c-list { grid-template-columns: repeat(4, 1fr) !important; }
}
.fb-c-card {
	border: 1px solid var(--fbc-border) !important; border-radius: 12px !important; background: #fff !important; overflow: hidden !important;
	display: flex !important; flex-direction: column !important; box-shadow: 0 1px 2px rgba(16,24,40,.04) !important; margin: 0 !important; padding: 0 !important;
}
.fb-c-card-head { padding: 20px 16px 14px !important; text-align: center !important; background: linear-gradient(180deg, var(--fbc-bg), #fff) !important; }
.fb-c-photo {
	width: 84px !important; height: 84px !important; border-radius: 50% !important; object-fit: cover !important; display: inline-block !important;
	border: 3px solid #fff !important; box-shadow: 0 2px 8px rgba(16,24,40,.15) !important; background: #e7e9ef !important;
}
.fb-c-photo--ph { position: relative !important; }
.fb-c-photo--ph::after {
	content: "" !important; position: absolute !important; inset: 0 !important; border-radius: 50% !important;
	background: #cfd4de url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238a92a3'><path d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2c-5 0-9 2.5-9 6v2h18v-2c0-3.5-4-6-9-6z'/></svg>") center/56% no-repeat !important;
}
.fb-c-head-text { display: block !important; }
.fb-c-name { margin: 12px 0 2px !important; font-size: 16px !important; color: var(--fbc-navy) !important; line-height: 1.25 !important; }
.fb-c-role { margin: 0 0 6px !important; font-size: 13px !important; font-weight: 600 !important; color: var(--fbc-muted) !important; }
.fb-c-loc { margin: 0 !important; font-size: 12px !important; font-weight: 700 !important; color: var(--fbc-red) !important; text-transform: uppercase !important; letter-spacing: .03em !important; }
.fb-c-state { margin: 3px 0 0 !important; font-size: 10.5px !important; font-weight: 600 !important; color: var(--fbc-muted) !important; text-transform: uppercase !important; letter-spacing: .05em !important; }

.fb-c-contacts { padding: 8px 14px 4px !important; display: flex !important; flex-direction: column !important; gap: 6px !important; }
.fb-c-contact {
	display: flex !important; align-items: center !important; gap: 8px !important; padding: 8px 10px !important; border-radius: 7px !important;
	background: #f4f6f9 !important; color: var(--fbc-navy) !important; text-decoration: none !important; font-size: 13px !important; word-break: break-word !important;
}
.fb-c-contact:hover { background: #eaeef5 !important; }
.fb-c-ic { flex: 0 0 auto !important; opacity: .7 !important; }

.fb-c-expertise { border-top: 1px solid var(--fbc-border) !important; }

.fb-c-profile {
	display: block !important;
	margin-top: auto !important;
	text-align: center !important;
	padding: 12px 16px !important;
	border-top: 1px solid var(--fbc-border) !important;
	color: var(--fbc-red) !important;
	font-weight: 700 !important;
	font-size: 13px !important;
	text-decoration: none !important;
}
.fb-c-profile:hover { background: #f7f9fc !important; text-decoration: underline !important; }
.fb-c-expertise summary {
	list-style: none !important; cursor: pointer !important; padding: 12px 16px !important; font-size: 13px !important; font-weight: 600 !important; color: var(--fbc-navy) !important;
	display: flex !important; justify-content: space-between !important; align-items: center !important;
}
.fb-c-expertise summary::-webkit-details-marker { display: none !important; }
.fb-c-expertise summary::after { content: "⌄" !important; font-size: 16px !important; opacity: .6 !important; }
.fb-c-expertise[open] summary::after { content: "⌃" !important; }
.fb-c-expertise-body { padding: 0 16px 14px !important; font-size: 13px !important; color: var(--fbc-muted) !important; line-height: 1.5 !important; }

.fb-c-empty { text-align: center !important; color: var(--fbc-muted) !important; padding: 30px !important; font-size: 15px !important; }

/* ---------- Map ---------- */
.fb-c-map-wrap { position: relative !important; }
#fb-c-map { width: 100% !important; height: 560px !important; border-radius: 12px !important; border: 1px solid var(--fbc-border) !important; background: #eef1f5 !important; }
.fb-c-map-err { padding: 24px !important; color: var(--fbc-muted) !important; }

.fb-c-map-popup {
	position: absolute !important; top: 16px !important; left: 16px !important; width: 260px !important; background: #fff !important; border-radius: 10px !important;
	box-shadow: 0 8px 30px rgba(16,24,40,.28) !important; padding: 16px !important; z-index: 5 !important;
}
.fb-c-popup-close {
	position: absolute !important; top: 6px !important; right: 8px !important; background: none !important; border: 0 !important; font-size: 22px !important; line-height: 1 !important;
	color: #9aa0aa !important; cursor: pointer !important;
}
.fb-c-popup-img { width: 60px !important; height: 60px !important; border-radius: 50% !important; object-fit: cover !important; }
.fb-c-map-popup h4 { margin: 8px 0 2px !important; color: var(--fbc-navy) !important; font-size: 15px !important; }
.fb-c-popup-role { margin: 0 0 4px !important; font-size: 12px !important; color: var(--fbc-muted) !important; font-weight: 600 !important; }
.fb-c-popup-loc { margin: 0 0 8px !important; font-size: 11px !important; color: var(--fbc-red) !important; text-transform: uppercase !important; font-weight: 700 !important; }
.fb-c-popup-contact { font-size: 12px !important; color: #333 !important; display: flex !important; flex-direction: column !important; gap: 3px !important; margin-bottom: 10px !important; }
.fb-c-popup-contact a { color: var(--fbc-navy) !important; }
.fb-c-popup-link { color: var(--fbc-red) !important; font-weight: 700 !important; text-decoration: none !important; font-size: 13px !important; }
.fb-c-popup-link:hover { text-decoration: underline !important; }

/* ---------- Responsive ---------- */
@media (max-width: 782px) {
	.fb-c-row--filters { flex-direction: column !important; align-items: stretch !important; }
	.fb-c-field { flex: 1 1 auto !important; }
	.fb-c-clear { align-self: stretch !important; }
	#fb-c-map { height: 460px !important; }
	.fb-c-map-popup { left: 8px !important; right: 8px !important; width: auto !important; }
}

/* Mobile: single-column, horizontal cards (avatar left, details right) */
@media (max-width: 600px) {
	.fb-contacts { font-size: 15px !important; }
	.fb-c-list { grid-template-columns: 1fr !important; gap: 12px !important; }

	.fb-c-card-head {
		display: flex !important; align-items: center !important; gap: 14px !important;
		text-align: left !important; padding: 14px !important; background: #fff !important;
	}
	.fb-c-photo { width: 60px !important; height: 60px !important; box-shadow: 0 1px 4px rgba(16,24,40,.12) !important; }
	.fb-c-head-text { flex: 1 1 auto !important; min-width: 0 !important; }
	.fb-c-name { margin: 0 0 2px !important; font-size: 16px !important; }
	.fb-c-role { margin: 0 0 3px !important; }
	.fb-c-loc { margin: 0 !important; }

	.fb-c-contacts { padding: 0 14px 10px !important; }
	.fb-c-contact { min-height: 44px !important; font-size: 14px !important; }

	.fb-c-az { flex-wrap: nowrap !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; padding-bottom: 4px !important; }
	.fb-c-letter { flex: 0 0 auto !important; }

	.fb-c-toggle { width: 100% !important; }
	.fb-c-toggle-btn { flex: 1 1 50% !important; }
}
