/* ============================================
   FACT Member Directory Styles
   ============================================ */

.fact-directory { max-width: 1200px; margin: 0 auto; padding: 20px 0; }

/* --- Filter Bar --- */
.fact-directory-filters {
	display: flex; flex-wrap: wrap; gap: 15px; align-items: center;
	margin-bottom: 30px; padding: 20px; background: #f8f9fa;
	border-radius: 8px;
}
.fact-filter-search { flex: 1; min-width: 250px; position: relative; }
.fact-filter-search input {
	width: 100%; padding: 12px 15px 12px 42px; border: 1px solid #ddd;
	border-radius: 6px; font-size: 15px; transition: border-color .2s;
	background: #fff;
}
.fact-filter-search input:focus { border-color: #e63946; outline: none; box-shadow: 0 0 0 3px rgba(230,57,70,.1); }
.fact-search-icon { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); font-size: 16px; opacity: .5; }
.fact-filter-category select {
	padding: 12px 15px; border: 1px solid #ddd; border-radius: 6px;
	font-size: 15px; min-width: 220px; background: #fff; cursor: pointer;
}
.fact-filter-count { font-size: 14px; color: #666; white-space: nowrap; }

/* --- Grid --- */
.fact-member-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	min-height: 200px;
	position: relative;
}
.fact-member-grid.is-loading { opacity: .5; pointer-events: none; }
.fact-member-grid.is-loading::after {
	content: ''; position: absolute; top: 50%; left: 50%;
	width: 40px; height: 40px; margin: -20px 0 0 -20px;
	border: 3px solid #e63946; border-top-color: transparent;
	border-radius: 50%; animation: fact-spin .8s linear infinite;
}
@keyframes fact-spin { to { transform: rotate(360deg); } }

/* --- Card --- */
.fact-member-card {
	display: flex; flex-direction: column; background: #fff;
	border: 1px solid #eee; border-radius: 10px;
	overflow: hidden; text-decoration: none; color: inherit;
	transition: transform .2s, box-shadow .2s;
}
.fact-member-card:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,.1); }
.fact-card-logo {
	height: 160px; display: flex; align-items: center; justify-content: center;
	padding: 20px; background: #fafafa; border-bottom: 1px solid #f0f0f0;
}
.fact-card-logo img { max-width: 100%; max-height: 120px; object-fit: contain; }
.fact-card-no-logo {
	width: 80px; height: 80px; border-radius: 50%; background: #e63946;
	display: flex; align-items: center; justify-content: center;
	color: #fff; font-size: 24px; font-weight: 700;
}
.fact-card-info { padding: 18px; flex: 1; display: flex; flex-direction: column; gap: 6px; }
.fact-card-name { font-size: 16px; font-weight: 700; margin: 0; color: #1d3557; line-height: 1.3; }
.fact-card-category {
	display: inline-block; font-size: 12px; color: #e63946; font-weight: 600;
	background: rgba(230,57,70,.08); padding: 3px 10px; border-radius: 20px;
	width: fit-content;
}
.fact-card-city { font-size: 13px; color: #999; }

.fact-no-results { grid-column: 1 / -1; text-align: center; padding: 60px 20px; color: #999; font-size: 16px; }

/* --- Single Member Page --- */
.fact-single-member { max-width: 900px; margin: 0 auto; padding: 40px 20px; }
.fact-single-header { display: flex; gap: 30px; align-items: flex-start; margin-bottom: 30px; }
.fact-single-logo { width: 180px; min-width: 180px; }
.fact-single-logo img { width: 100%; height: auto; border-radius: 8px; }
.fact-single-title { font-size: 28px; font-weight: 800; color: #1d3557; margin: 0 0 10px; }
.fact-single-category { display: inline-block; background: #e63946; color: #fff; padding: 4px 14px; border-radius: 20px; font-size: 13px; font-weight: 600; }
.fact-single-description { font-size: 15px; line-height: 1.7; color: #444; margin: 25px 0; white-space: pre-line; }
.fact-single-details { background: #f8f9fa; padding: 25px; border-radius: 10px; margin: 25px 0; }
.fact-single-details h3 { margin: 0 0 15px; font-size: 18px; color: #1d3557; }
.fact-detail-row { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid #eee; }
.fact-detail-label { font-weight: 600; color: #555; min-width: 100px; }
.fact-detail-value a { color: #e63946; }

/* Contact (protected) */
.fact-contact-section { background: #fff3f3; padding: 25px; border-radius: 10px; border: 1px solid #fdd; margin: 25px 0; }
.fact-contact-section h3 { margin: 0 0 15px; color: #1d3557; }
.fact-contact-locked { text-align: center; padding: 30px; }
.fact-contact-locked p { color: #666; margin-bottom: 15px; }
.fact-contact-locked .fact-login-btn {
	display: inline-block; background: #e63946; color: #fff; padding: 12px 30px;
	border-radius: 6px; text-decoration: none; font-weight: 600; transition: background .2s;
}
.fact-contact-locked .fact-login-btn:hover { background: #c62828; }

/* Contact Request Form */
.fact-contact-form { margin-top: 20px; }
.fact-contact-form label { display: block; margin-bottom: 5px; font-weight: 600; color: #555; font-size: 14px; }
.fact-contact-form input, .fact-contact-form textarea {
	width: 100%; padding: 10px 14px; border: 1px solid #ddd; border-radius: 6px;
	font-size: 14px; margin-bottom: 15px; font-family: inherit;
}
.fact-contact-form textarea { min-height: 120px; resize: vertical; }
.fact-contact-form button {
	background: #e63946; color: #fff; border: none; padding: 12px 30px;
	border-radius: 6px; font-size: 15px; font-weight: 600; cursor: pointer; transition: background .2s;
}
.fact-contact-form button:hover { background: #c62828; }
.fact-alert-success { background: #d4edda; color: #155724; padding: 15px; border-radius: 6px; margin-bottom: 20px; }
.fact-alert-error { background: #f8d7da; color: #721c24; padding: 15px; border-radius: 6px; margin-bottom: 20px; }
.fact-back-link { display: inline-block; margin-bottom: 20px; color: #e63946; text-decoration: none; font-weight: 600; }

/* --- Responsive --- */
@media (max-width: 992px) { .fact-member-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) {
	.fact-member-grid { grid-template-columns: 1fr; }
	.fact-directory-filters { flex-direction: column; }
	.fact-filter-search, .fact-filter-category select { width: 100%; min-width: 0; }
	.fact-single-header { flex-direction: column; }
	.fact-single-logo { width: 120px; min-width: 120px; }
}

/* Status badge on cards */
.fact-card-status { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }