/* AI-Header: Contact Exchange Search Component Styles - Step 1 member search functionality */
/* Date: 2025-09-10 */

/* ===========================================
   CONTACT EXCHANGE STEP 1 - SEARCH STYLES
   =========================================== */

/* Override any conflicting search-container styling from other components */
.contact-exchange-search .search-container {
    position: relative;
    width: 100%;
    max-width: none; /* Remove any width constraints */
}

.contact-exchange-search .search-container i {
    position: static; /* Reset absolute positioning */
    transform: none; /* Reset transform */
    z-index: auto; /* Reset z-index */
}

/* Search input styling for contact exchange */
.contact-exchange-search .search-input-icon {
    background: var(--bs-tertiary-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-secondary-color);
}

.contact-exchange-search .form-control {
    background: var(--bs-body-bg);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

.contact-exchange-search .form-control:focus {
    background: var(--bs-body-bg);
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.25);
    color: var(--bs-body-color);
}

/* Search results container */
.contact-exchange-search .search-results {
    width: 100%;
    margin-top: 16px;
}

/* Table styling for search results */
.contact-exchange-search .table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.contact-exchange-search .table {
    width: 100%;
    margin-bottom: 0;
}

/* Member result row styling */
.contact-exchange-search .member-result-row {
    transition: all 0.2s ease;
    cursor: pointer;
}

.contact-exchange-search .member-result-row:hover {
    background-color: var(--bs-tertiary-bg) !important;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.contact-exchange-search .table-active {
    background-color: var(--bs-primary-bg-subtle) !important;
    border-left: 3px solid var(--bs-primary);
}

.contact-exchange-search .table-active:hover {
    background-color: var(--bs-primary-bg-subtle) !important;
    opacity: 0.9;
}

/* Arrow hover animation */
.contact-exchange-search .member-result-row:hover .bi-arrow-right {
    color: var(--bs-primary) !important;
    transform: translateX(2px);
    transition: all 0.2s ease;
}

.contact-exchange-search .bi-arrow-right {
    transition: all 0.2s ease;
}

/* Contact avatar styling */
.contact-exchange-search .contact-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--bs-primary) 0%, #8B4A52 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    font-weight: 600;
    color: #ffffff;
    flex-shrink: 0;
}

/* Contact info icons */
.contact-exchange-search .contact-icon {
    color: var(--bs-secondary-color);
    font-size: 14px;
}

.contact-exchange-search .contact-icon.text-success {
    color: var(--bs-success) !important;
}

.contact-exchange-search .contact-icon.text-primary {
    color: var(--bs-primary) !important;
}

.contact-exchange-search .contact-icon.text-info {
    color: var(--bs-info) !important;
}

.contact-exchange-search .contact-icon.text-warning {
    color: var(--bs-warning) !important;
}

/* Progress indicator styling */
.contact-exchange-search .rz-steps {
    margin-bottom: 1.5rem;
}

/* Status indicators */
.contact-exchange-search .bi-check-circle-fill {
    color: var(--bs-success) !important;
}

.contact-exchange-search .bi-arrow-right {
    color: var(--bs-primary) !important;
}

/* Alert styling within search component */
.contact-exchange-search .alert {
    border-radius: 8px;
    margin-bottom: 16px;
}

/* ===========================================
   DARK THEME SUPPORT
   =========================================== */

[data-bs-theme="dark"] .contact-exchange-search .search-input-icon {
    background: var(--bs-dark);
    border-color: var(--bs-border-color);
    color: var(--bs-secondary-color);
}

[data-bs-theme="dark"] .contact-exchange-search .form-control {
    background: var(--bs-dark);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .contact-exchange-search .form-control:focus {
    background: var(--bs-dark);
    border-color: var(--bs-primary);
    color: var(--bs-body-color);
}

[data-bs-theme="dark"] .contact-exchange-search .table {
    --bs-table-bg: transparent;
    --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
    --bs-table-active-bg: rgba(var(--bs-primary-rgb), 0.2);
    --bs-table-hover-bg: rgba(255, 255, 255, 0.075);
}

[data-bs-theme="dark"] .contact-exchange-search .member-result-row:hover {
    background-color: var(--bs-tertiary-bg) !important;
}

[data-bs-theme="dark"] .contact-exchange-search .table-active {
    background-color: rgba(var(--bs-primary-rgb), 0.2) !important;
}

/* ===========================================
   RESPONSIVE DESIGN
   =========================================== */

@media (max-width: 768px) {
    .contact-exchange-search .table-responsive {
        font-size: 0.875rem;
    }
    
    .contact-exchange-search .contact-avatar {
        width: 36px;
        height: 36px;
        font-size: 0.8rem;
    }
    
    .contact-exchange-search .table th,
    .contact-exchange-search .table td {
        padding: 0.5rem 0.25rem;
    }
    
    /* Hide company column on very small screens */
    .contact-exchange-search .table th:nth-child(2),
    .contact-exchange-search .table td:nth-child(2) {
        display: none;
    }
}

@media (max-width: 576px) {
    .contact-exchange-search .table th:nth-child(3),
    .contact-exchange-search .table td:nth-child(3) {
        display: none;
    }
}

/* ===========================================
   ACCESSIBILITY IMPROVEMENTS
   =========================================== */

.contact-exchange-search .member-result-row:focus-visible {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .contact-exchange-search .member-result-row,
    .contact-exchange-search .bi-arrow-right {
        transition: none;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .contact-exchange-search .table {
        border: 2px solid var(--bs-border-color);
    }
    
    .contact-exchange-search .table-active {
        border-left-width: 4px;
    }
}