/* Contact Table Styles - Table view specific styles */

/* Table Container */
.table-container {
    padding: 0;
    overflow-x: auto;
    background: white;
}

/* Main Table */
table {
    width: 100%;
    border-collapse: collapse;
    background: white;
}

/* Table Header */
thead {
    background: #f7f9fc;
    border-bottom: 2px solid #e1e4e8;
}

/* Table Header - using very specific selector to ensure it applies */
#standardTable th,
#standardTable thead th,
#standardTable thead tr th,
.table-container #standardTable thead th {
    padding: 12px 16px !important;
    text-align: left !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 9px !important;
    letter-spacing: 0.5px !important;
    color: #0f172a !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
    background: #f7f9fc !important;
}

/* Table Body */
tbody tr {
    transition: all 0.2s ease;
    border-bottom: 1px solid #f1f5f9;
}

tbody tr:hover {
    background: #f7f9fc;
}

td {
    padding: 12px 16px;
    font-size: 13px;
    color: #0f172a;
    font-weight: 500;
}

/* ⭐ Smaller font for ALL data columns */
#standardTable tbody td {
    font-size: 12px !important;
}

/* Created Date - muted color */
#standardTable tbody td:nth-child(10) {
    color: #64748b !important;
}

/* Action Buttons */
.action-buttons {
    display: flex !important;
    gap: 3px;
    visibility: visible !important;
    overflow: visible !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap;
}

/* Ensure the Actions column cell aligns left */
#standardTable tbody td:last-child,
#standardTable tbody tr td:last-child {
    text-align: left !important;
}

#standardTable tbody td:last-child .action-buttons {
    justify-content: flex-start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
}

.action-btn,
#standardTable .action-btn,
.action-buttons .action-btn {
    padding: 3px 6px !important;
    border: 1px solid transparent !important;
    border-radius: 3px !important;
    cursor: pointer !important;
    font-size: 8px !important;
    font-weight: 600 !important;
    transition: all 0.2s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 2px !important;
    visibility: visible !important;
    overflow: visible !important;
    opacity: 1 !important;
    white-space: nowrap !important;
}

/* Override touch device styles from contact-responsive.css */
@media (hover: none) and (pointer: coarse) {
    .action-btn,
    #standardTable .action-btn,
    .action-buttons .action-btn {
        min-height: unset !important;
    }
}

.view-btn-action {
    color: white !important;
    background: #10b981 !important;
    border-color: #10b981 !important;
}

.view-btn-action:hover {
    background: #059669 !important;
    color: white !important;
    border-color: #059669 !important;
}

.card-btn-action {
    color: white !important;
    background: #7c3aed !important;
    border-color: #7c3aed !important;
}

.card-btn-action:hover {
    background: #6d28d9 !important;
    color: white !important;
    border-color: #6d28d9 !important;
}

.delete-btn {
    color: white !important;
    background: #dc2626 !important;
    border-color: #dc2626 !important;
}

.delete-btn:hover {
    background: #b91c1c !important;
    color: white !important;
    border-color: #b91c1c !important;
}

/* Status Badge */
.status-badge {
    padding: 3px 6px;
    border-radius: 3px;
    font-size: 8px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.status-badge::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
}

.status-active {
    background: #d1fae5;
    color: #064e3b;
    font-weight: 700;
}

.status-active::before {
    background: #10b981;
}

.status-inactive {
    background: #fee2e2;
    color: #7f1d1d;
    font-weight: 700;
}

.status-inactive::before {
    background: #ef4444;
}

/* Virtual Table Styles */
#virtualTableContainer {
    display: none;
    position: relative;
    overflow-y: auto;
    height: calc(100vh - 300px);
}

#virtualTableBody {
    position: relative;
}

.virtual-row {
    position: absolute;
    width: 100%;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #f1f5f9;
}

.virtual-row:hover {
    background: #f7f9fc;
}

.virtual-row table {
    width: 100%;
}