/* NeuraRealty Directory Styles - Agents & Brokers */



/* Page Header */

.nr-page-header { margin-bottom: 32px; }

.nr-page-title { font-family: var(--font-display); font-size: 32px; font-weight: 700; display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }

.nr-page-subtitle { color: var(--nr-text-muted); font-size: 15px; }



/* Filters Bar */

.nr-filters-bar { background: var(--nr-bg-card); border: 1px solid var(--nr-border); border-radius: var(--nr-radius-lg); padding: 20px; margin-bottom: 24px; }

.nr-filters-form { display: flex; gap: 16px; align-items: flex-end; flex-wrap: wrap; }

.nr-filter-group { display: flex; flex-direction: column; gap: 6px; }

.nr-filter-group label { font-size: 11px; font-weight: 600; color: var(--nr-text-muted); text-transform: uppercase; letter-spacing: 0.5px; display: flex; align-items: center; gap: 4px; }

.nr-filter-search { flex: 1; min-width: 250px; }

.nr-filter-input, .nr-filter-select { padding: 10px 14px; border: 1px solid var(--nr-border); border-radius: var(--nr-radius-sm); font-size: 14px; background: var(--nr-bg-secondary); transition: all 0.2s; }

.nr-filter-input:focus, .nr-filter-select:focus { outline: none; border-color: var(--nr-primary); background: white; }

.nr-filter-select { min-width: 180px; cursor: pointer; }



/* Results Header/Footer */

.nr-results-header, .nr-results-footer { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; flex-wrap: wrap; gap: 16px; }

.nr-results-footer { margin-top: 32px; margin-bottom: 0; }

.nr-results-count { font-size: 14px; color: var(--nr-text-secondary); }



/* Pagination */

.nr-pagination { display: flex; align-items: center; gap: 4px; }

.nr-page-btn { padding: 8px 12px; border: 1px solid var(--nr-border); border-radius: var(--nr-radius-sm); font-size: 13px; font-weight: 500; color: var(--nr-text-secondary); text-decoration: none; transition: all 0.2s; background: var(--nr-bg-card); }

.nr-page-btn:hover { border-color: var(--nr-primary); color: var(--nr-primary); }

.nr-page-btn.active { background: var(--nr-primary); color: white; border-color: var(--nr-primary); }

.nr-page-info { font-size: 13px; color: var(--nr-text-muted); margin-left: 12px; }



/* Agents Grid */

.nr-agents-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(380px, 1fr)); gap: 16px; }



.nr-agent-card { background: var(--nr-bg-card); border: 1px solid var(--nr-border); border-radius: var(--nr-radius-lg); padding: 20px; display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: start; transition: all 0.2s; }

.nr-agent-card:hover { box-shadow: var(--nr-shadow-md); border-color: var(--nr-primary-light); }



.nr-agent-avatar { width: 56px; height: 56px; border-radius: 50%; background: var(--nr-gradient-hero); color: white; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 600; flex-shrink: 0; }



.nr-agent-info { min-width: 0; }

.nr-agent-name { font-size: 15px; font-weight: 600; color: var(--nr-text-primary); margin-bottom: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.nr-agent-license, .nr-agent-location, .nr-agent-employer { font-size: 12px; color: var(--nr-text-muted); display: flex; align-items: center; gap: 4px; margin-top: 4px; }

.nr-agent-employer { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 200px; }



/* Badges */

.nr-badge { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.3px; }

.nr-badge-broker { background: #FEF3C7; color: #92400E; }

.nr-badge-broker-sales { background: #E0E7FF; color: #3730A3; }

.nr-badge-sales { background: #D1FAE5; color: #065F46; }



/* Agent Status */

.nr-agent-status { text-align: right; }

.nr-status-badge { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 20px; font-size: 11px; font-weight: 600; }

.nr-status-active { background: #D1FAE5; color: #065F46; }

.nr-status-inactive { background: #FEE2E2; color: #991B1B; }

.nr-agent-exp { font-size: 11px; color: var(--nr-text-muted); margin-top: 6px; }



/* Agent Actions */

.nr-agent-actions { grid-column: 1 / -1; border-top: 1px solid var(--nr-border); padding-top: 12px; margin-top: 4px; }

.nr-claim-box { display: flex; align-items: center; justify-content: space-between; }

.nr-claim-text { font-size: 12px; color: var(--nr-text-muted); }



/* Brokers Grid */

.nr-brokers-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); gap: 20px; }



.nr-broker-card { background: var(--nr-bg-card); border: 1px solid var(--nr-border); border-radius: var(--nr-radius-lg); padding: 24px; transition: all 0.2s; }

.nr-broker-card:hover { box-shadow: var(--nr-shadow-md); border-color: var(--nr-primary-light); }



.nr-broker-header { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 20px; }

.nr-broker-avatar { width: 56px; height: 56px; border-radius: var(--nr-radius-md); background: linear-gradient(135deg, #F59E0B, #D97706); color: white; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 700; flex-shrink: 0; }

.nr-broker-info { min-width: 0; flex: 1; }

.nr-broker-name { font-size: 16px; font-weight: 600; color: var(--nr-text-primary); margin-bottom: 6px; line-height: 1.3; }

.nr-broker-license, .nr-broker-location { font-size: 12px; color: var(--nr-text-muted); display: flex; align-items: center; gap: 4px; margin-top: 4px; }



.nr-broker-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; padding: 16px 0; border-top: 1px solid var(--nr-border); border-bottom: 1px solid var(--nr-border); margin-bottom: 16px; }

.nr-broker-stat { text-align: center; }

.nr-broker-stat-value { font-family: var(--font-display); font-size: 20px; font-weight: 700; color: var(--nr-primary); }

.nr-broker-stat-label { font-size: 11px; color: var(--nr-text-muted); text-transform: uppercase; letter-spacing: 0.3px; }



.nr-broker-actions .nr-claim-box { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

.nr-broker-actions .nr-claim-text { flex: 1; }



/* Empty State */

.nr-empty-state { grid-column: 1 / -1; text-align: center; padding: 60px 20px; }

.nr-empty-icon { margin-bottom: 16px; opacity: 0.3; }

.nr-empty-state h3 { font-size: 18px; color: var(--nr-text-primary); margin-bottom: 8px; }

.nr-empty-state p { color: var(--nr-text-muted); }



/* Responsive */

@media (max-width: 768px) {

    .nr-filters-form { flex-direction: column; }

    .nr-filter-group { width: 100%; }

    .nr-filter-search { min-width: 100%; }

    .nr-agents-grid { grid-template-columns: 1fr; }

    .nr-agent-card { grid-template-columns: auto 1fr; }

    .nr-agent-status { grid-column: 2; grid-row: 1; }

    .nr-agent-actions { grid-column: 1 / -1; }

    .nr-brokers-grid { grid-template-columns: 1fr; }

    .nr-broker-stats { grid-template-columns: repeat(2, 1fr); }

    .nr-broker-actions .nr-claim-box { flex-direction: column; align-items: stretch; }

    .nr-broker-actions .nr-claim-text { text-align: center; margin-bottom: 8px; }

}




/* State Badge - Multi-state support */

.nr-badge-state { background: #E0E7FF; color: #3730A3; }

.nr-agent-badges { display: flex; gap: 6px; margin-bottom: 6px; }

.nr-filter-select:disabled { opacity: 0.5; cursor: not-allowed; }




/* NeuraWeb Verified Agent Card Styles */

.nr-agent-card-verified { 

    background: rgba(59, 130, 246, 0.08); 

    border-color: rgba(59, 130, 246, 0.3); 

}

.nr-agent-card-verified:hover { 

    border-color: var(--nr-info); 

    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15); 

}

.nr-agent-card-verified .nr-agent-avatar { 

    background: linear-gradient(135deg, #3B82F6, #1D4ED8); 

}

.nr-agent-card-verified .nr-status-active { 

    background: rgba(59, 130, 246, 0.15); 

    color: #1D4ED8; 

}

.nr-agent-card-verified .nr-claim-text { 

    color: #2563EB; 

    font-weight: 500; 

}

.nr-agent-card-verified .nr-btn-secondary { 

    background: #3B82F6; 

    color: white; 

    border-color: #3B82F6; 

}

.nr-agent-card-verified .nr-btn-secondary:hover { 

    background: #2563EB; 

    border-color: #2563EB; 

}




/* Verified Checkbox */

.nr-filter-verified { align-self: center; }

.nr-checkbox-label { 

    display: flex; 

    align-items: center; 

    gap: 8px; 

    cursor: pointer; 

    font-size: 13px; 

    font-weight: 500;

    color: var(--nr-text-secondary);

    white-space: nowrap;

}

.nr-checkbox-label input[type="checkbox"] { 

    width: 16px; 

    height: 16px; 

    accent-color: #3B82F6; 

    cursor: pointer;

}

.nr-checkbox-label span { display: flex; align-items: center; gap: 4px; }

.nr-checkbox-label:hover { color: #3B82F6; }




/* NeuraWeb Verified Broker Card Styles */

.nr-broker-card-verified { 

    background: rgba(59, 130, 246, 0.08); 

    border-color: rgba(59, 130, 246, 0.3); 

}

.nr-broker-card-verified:hover { 

    border-color: var(--nr-info); 

    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15); 

}

.nr-broker-card-verified .nr-broker-avatar { 

    background: linear-gradient(135deg, #3B82F6, #1D4ED8); 

}

.nr-broker-card-verified .nr-claim-text { 

    color: #2563EB; 

    font-weight: 500; 

}

.nr-broker-card-verified .nr-btn-primary { 

    background: #3B82F6; 

    border-color: #3B82F6; 

}

.nr-broker-card-verified .nr-btn-primary:hover { 

    background: #2563EB; 

    border-color: #2563EB; 

}