/* ==================== Results Page Styles ==================== */

.results-page {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    --results-content-gap: clamp(0.75rem, 1.2vw, 1rem);
    --results-card-padding: clamp(1rem, 1.8vw, 1.5rem);
    --results-summary-gap: var(--config-inline-gap);
    --results-summary-card-min: 160px;
    --results-summary-card-height: 90px;
}

/* Results Summary */
.results-summary-card {
    background: var(--surface-bg);
    border: 1px solid var(--surface-border);
    border-radius: 12px;
    box-shadow: var(--surface-shadow-soft);
    margin: 0;
    overflow: visible;
}

.results-summary-card .card-body {
    padding: var(--results-card-padding);
    background: var(--card-body-bg);
    background-color: var(--card-body-bg);
    border-radius: inherit;
}

.results-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--results-summary-card-min), 100%), 1fr));
    gap: var(--results-summary-gap);
    align-items: stretch;
    background: transparent;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
}

.summary-item {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    text-align: center;
    padding: 0.6rem 0.5rem;
    background: linear-gradient(135deg, var(--surface-muted-bg) 0%, var(--surface-bg) 100%);
    border-radius: 8px;
    border-left: 3px solid var(--primary);
                box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                border-left-color 0.18s ease;
    position: relative;
    overflow: hidden;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    min-height: var(--results-summary-card-height);
    height: var(--results-summary-card-height);
}

.summary-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(var(--primary-rgb), 0.3), transparent);
    opacity: 0;
}

.summary-item.clickable-stat {
    cursor: pointer;
}

.summary-item.clickable-stat:hover {
    background: linear-gradient(135deg, var(--surface-hover-bg) 0%, var(--surface-muted-bg) 100%);
    box-shadow: var(--surface-shadow-hover);
    border-left-color: var(--primary);
}

.summary-item.clickable-stat:hover::before {
    opacity: 1;
}

.summary-item[data-filter="success"] {
    border-left-color: #28a745;
}

.summary-item[data-filter="success"]:hover {
    border-left-color: #28a745;
}

.summary-item[data-filter="failed"] {
    border-left-color: #dc3545;
}

.summary-item[data-filter="failed"]:hover {
    border-left-color: #dc3545;
}

.summary-label {
    font-size: clamp(0.5rem, 1.2vw + 0.5rem, 0.8rem);
    color: var(--control-placeholder);
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 0;
    text-align: center;
    width: 100%;
}

.summary-value {
    font-size: clamp(0.9rem, 2.5vw + 0.5rem, 1.75rem);
    font-weight: 400;
    color: var(--primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.2;
    flex-shrink: 0;
    text-align: center;
    width: 100%;
}

.summary-item.clickable-stat:hover .summary-value {
    transform: scale(1.05);
}

.summary-value.success {
    color: #28a745;
}

.summary-value.failed {
    color: #dc3545;
}

/* Results Actions */
.results-actions {
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    align-items: center;
    background: var(--surface-bg);
    padding: 1.5rem;
    border-radius: 8px;
    box-shadow: var(--surface-shadow-soft);
    flex-wrap: nowrap;
}

.filter-container-inline {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 1rem;
    align-items: stretch;
    flex: 1;
    min-width: 0;
}

.filter-container-inline .filter-group {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
    flex-shrink: 0;
    height: 100%;
}

.filter-container-inline .filter-group label {
    white-space: nowrap;
    margin: 0;
    display: flex;
    align-items: center;
    height: 100%;
}

.filter-container-inline .filter-date-range {
    flex-direction: row !important;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
    flex-shrink: 0;
    display: none !important; /* Mặc định ẩn, dùng !important để override các rule khác */
}

.filter-container-inline .filter-date-range[style*="display: flex"] {
    display: flex !important;
}

.date-range-label {
    font-size: 0.9rem;
    color: var(--control-text);
    font-weight: var(--form-control-font-weight, 400);
    white-space: nowrap;
}

.date-checkbox-label {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    cursor: pointer;
    font-size: 0.9rem;
    color: var(--control-text);
    white-space: nowrap;
}

.date-checkbox-label span {
    user-select: none;
}

.filter-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-date-range {
    flex-direction: row !important;
    align-items: center;
    gap: 0.5rem;
}

.filter-date-range label {
    white-space: nowrap;
    margin: 0;
}

.filter-group label {
    font-size: 0.85rem;
    color: #666;
    font-weight: var(--form-control-font-weight, 400);
    white-space: nowrap;
}

.filter-date-input {
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--control-border);
    border-radius: var(--form-control-radius);
    font-size: var(--form-control-font-size);
    background: var(--control-bg);
    color: var(--control-text);
    width: 120px;
    max-width: 120px;
}

.filter-date-input:hover {
    border-color: var(--primary);
}

.filter-group .btn {
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
}

.filter-buttons {
    flex-direction: row !important;
    align-items: center;
    gap: 0.5rem;
}

.filter-buttons label {
    display: none;
}

.register-results-table {
    min-width: 2105px; /* Tổng độ rộng tối thiểu của 13 cột, gồm cột trạng thái ghim phải. */
}

.register-results-table th:nth-child(1),
.register-results-table th:first-child {
    width: 55px !important;
    min-width: 55px;
    max-width: 55px;
    text-align: center;
    vertical-align: middle;
    position: sticky;
    left: 0;
    z-index: 10;
} /* STT - ghim bên trái */

.register-results-table th:nth-child(2) {
    width: 150px;
    min-width: 150px;
    text-align: center;
} /* UID */
.register-results-table th:nth-child(3) {
    width: 160px;
    min-width: 160px;
    text-align: center;
} /* Full Name */
.register-results-table th:nth-child(4) {
    width: 110px;
    min-width: 110px;
} /* Password */
.register-results-table th:nth-child(5) {
    width: 140px;
    min-width: 140px;
    text-align: center;
} /* 2FA */
.register-results-table th:nth-child(6) {
    width: 310px;
    min-width: 310px;
} /* Cookie */
.register-results-table th:nth-child(7) {
    width: 220px;
    min-width: 220px;
} /* Token */
.register-results-table th:nth-child(8) {
    width: 180px;
    min-width: 180px;
    text-align: center;
} /* Email */
.register-results-table th:nth-child(9) {
    width: 145px;
    min-width: 145px;
    text-align: center;
} /* Password Email */
.register-results-table th:nth-child(10) {
    width: 135px;
    min-width: 135px;
    text-align: center;
} /* Phone */
.register-results-table th:nth-child(11) {
    width: 160px;
    min-width: 160px;
    text-align: center;
} /* Proxy */
.register-results-table th:nth-child(12) {
    width: 165px !important;
    min-width: 165px;
    max-width: 165px;
    text-align: center;
} /* Thời gian */
.register-results-table th:nth-child(13) {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px;
    padding: 0.55rem 0.35rem;
    text-align: center;
    position: sticky;
    right: 0;
    z-index: 30;
} /* Trạng thái - ghim bên phải */

.register-results-table th:last-child {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px;
}

.register-results-table td:nth-child(1),
.register-results-table td:first-child {
    width: 55px !important;
    min-width: 55px;
    max-width: 55px;
    text-align: center;
    vertical-align: middle;
    position: sticky;
    left: 0;
    z-index: 5;
} /* STT - ghim bên trái */

.register-results-table td:nth-child(2) {
    width: 150px;
    min-width: 150px;
    text-align: center;
} /* UID */
.register-results-table td:nth-child(3) {
    width: 160px;
    min-width: 160px;
    text-align: center;
} /* Full Name */
.register-results-table td:nth-child(4) {
    width: 110px;
    min-width: 110px;
} /* Password */
.register-results-table td:nth-child(5) {
    width: 140px;
    min-width: 140px;
    text-align: center;
} /* 2FA */
.register-results-table td:nth-child(6) {
    width: 310px;
    min-width: 310px;
} /* Cookie */
.register-results-table td:nth-child(7) {
    width: 220px;
    min-width: 220px;
} /* Token */
.register-results-table td:nth-child(8) {
    width: 180px;
    min-width: 180px;
    text-align: center;
} /* Email */
.register-results-table td:nth-child(9) {
    width: 145px;
    min-width: 145px;
    text-align: center;
} /* Password Email */
.register-results-table td:nth-child(10) {
    width: 135px;
    min-width: 135px;
    text-align: center;
} /* Phone */
.register-results-table td:nth-child(11) {
    width: 160px;
    min-width: 160px;
    text-align: center;
} /* Proxy */
.register-results-table td:nth-child(12) {
    width: 165px !important;
    min-width: 165px;
    max-width: 165px;
    text-align: center;
} /* Thời gian */

.register-results-table td:nth-child(13) {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px;
    text-align: center;
    position: sticky;
    right: 0;
    z-index: 25;
    isolation: isolate;
} /* Trạng thái - ghim bên phải */

.register-results-table td:last-child {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px;
}

.results-table .column-hidden {
    display: none !important;
}

.register-results-table.status-column-hidden th:nth-child(12),
.register-results-table.status-column-hidden td:nth-child(12) {
    border-right: 1px solid var(--results-table-border-color);
}

.status-header-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    position: relative;
    width: 100%;
    min-height: 26px;
    padding: 0 22px;
    min-width: 0;
}

.status-header-content .column-settings-dropdown-header {
    position: absolute;
    top: 50%;
    right: -4px;
    display: inline-flex;
    align-items: center;
    transform: translateY(-50%);
}

.status-header-content > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    text-align: center;
}

/* Cột Trạng thái - căn giữa và không in đậm */
.register-results-table th:nth-child(13),
.register-results-table td:nth-child(13) {
    text-align: center;
}

.register-results-table td:nth-child(13) {
    font-weight: normal !important;
}

.register-results-table td:nth-child(13) .status-badge-table {
    font-weight: normal !important;
    position: relative;
    z-index: 3;
}

/* Copyable cells */
.copyable-cell {
    cursor: pointer;
    user-select: none;
}

.cookie-cell {
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: break-all;
}

.empty-message {
    text-align: center;
    color: #808080;
    font-style: italic;
    padding: 2rem !important;
    font-size: 0.9rem;
    width: 100%;
    display: table-cell;
    position: relative;
}

.status-badge-table {
    display: inline-block;
    font-size: 0.9rem;
    font-weight: 400;
    background: none;
    border: none;
    padding: 0;
}

.status-badge-table.success {
    color: #28a745;
}

.status-badge-table.failed {
    color: #dc3545;
}

.column-settings-dropdown {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
}

.column-settings-dropdown-header {
    position: absolute;
    top: 50%;
    right: 2px;
    flex: 0 0 auto;
    transform: translateY(-50%);
}

.btn-column-settings {
    height: var(--form-control-height, 38px);
    min-height: var(--form-control-height, 38px);
    padding: 0 0.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    white-space: nowrap;
}

.btn-column-settings.active,
.btn-column-settings:hover {
    border-color: var(--primary);
}

.btn-column-settings-icon {
    width: 26px;
    height: 26px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--control-placeholder);
    cursor: pointer;
}

.btn-column-settings-icon:hover,
.btn-column-settings-icon.active {
    background: transparent;
    color: var(--primary);
}

.column-settings-icon-svg {
    width: 16px;
    height: 16px;
    display: block;
    color: currentColor;
    stroke: currentColor;
    filter: none;
    pointer-events: none;
    transform-origin: center;
}

.btn-column-settings-icon:hover .column-settings-icon-svg,
.btn-column-settings-icon.active .column-settings-icon-svg {
    filter: none;
}

.btn-column-settings-icon.active .column-settings-icon-svg {
    transform: rotate(90deg);
}

.column-settings-menu {
    position: fixed;
    top: auto;
    left: auto;
    z-index: 10002;
    width: min(520px, calc(100vw - 16px));
    max-height: min(70vh, 520px);
    overflow-y: auto;
    padding: 0.6rem;
    background: #ffffff;
    border: 1px solid var(--results-table-border-color);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
    text-align: left;
}

.column-settings-title {
    padding: 0;
    font-size: 0.76rem;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.column-settings-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.45rem;
}

.column-settings-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.25rem;
}

.column-settings-select-all {
    flex: 0 0 auto;
    min-height: 28px;
    margin: 0;
    padding: 0.34rem 0.5rem;
    border: 1px solid transparent;
    background: transparent;
    color: var(--dropdown-option-text);
}

.column-settings-item span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.column-settings-summary {
    max-width: 100%;
    margin: 0 0 0.55rem;
    padding: 0.45rem 0.55rem;
    border: 1px solid var(--dropdown-border);
    border-radius: 8px;
    background: var(--surface-muted-bg);
    color: var(--dropdown-option-text);
    font-size: 0.76rem;
    font-weight: 400;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Responsive */
@media (max-width: 768px) {
    .results-summary {
        grid-template-columns: repeat(auto-fit, minmax(min(125px, 100%), 1fr));
    }
    
    .results-summary .summary-item {
        padding: 0.5rem 0.35rem;
    }
    
    .summary-label {
        font-size: clamp(0.6rem, 2vw, 0.7rem);
    }
    
    .summary-value {
        font-size: clamp(1rem, 2.5vw, 1.5rem);
    }

    .results-actions {
        flex-direction: row;
        gap: 0.75rem;
        padding: 1rem;
        flex-wrap: nowrap;
        align-items: stretch;
    }

    .filter-container-inline {
        width: auto;
        flex-wrap: nowrap;
        gap: 0.75rem;
        flex: 1;
        min-width: 0;
    }
    
    .filter-container-inline .filter-group {
        gap: 0.25rem;
        flex-shrink: 0;
    }
    
    .filter-group label {
        font-size: 0.75rem;
    }
    
    .filter-date-range {
        flex-wrap: nowrap;
        gap: 0.25rem;
    }
    
    .filter-date-range label {
        font-size: 0.75rem;
    }
    
    .filter-date-range .filter-date-input {
        font-size: 0.8rem;
        padding: 0.4rem 0.5rem;
        width: 100px;
        max-width: 100px;
        min-width: 100px;
        height: calc(0.4rem * 2 + 0.8rem * 1.2 + 2px);
        box-sizing: border-box;
    }

    .results-actions .btn {
        flex: 0 0 auto;
        height: calc(0.4rem * 2 + 0.8rem * 1.2 + 2px);
    }

    .results-table-container.has-horizontal-overflow {
        overflow-x: auto;
    }
    
    .results-table {
        font-size: 0.8rem;
    }
    
    .results-table th,
    .results-table td {
        padding: 0.5rem;
    }
    
    /* Đảm bảo cột STT luôn cố định 55px (trừ khi có empty message) */
    .results-table th:nth-child(1),
    .results-table th:first-child,
    .results-table td:nth-child(1):not(.empty-message),
    .results-table td:first-child:not(.empty-message) {
        width: 55px !important;
        min-width: 55px;
        max-width: 55px;
        text-align: center;
        vertical-align: middle;
    }
    
    /* Đảm bảo cột Thời gian luôn đủ rộng để hiển thị ngày giờ (trừ khi có empty message) */
    .results-table th[data-column="time"],
    .results-table td[data-column="time"]:not(.empty-message) {
        width: 165px !important;
        min-width: 165px;
        max-width: 165px;
    }
    
    /* Đảm bảo empty message căn giữa ở mobile */
    /* Khi có empty message, bỏ min-width của table để table có thể thu nhỏ */
    .results-table-container:has(.empty-message) .results-table,
    .results-table:has(.empty-message),
    .results-table tbody:has(.empty-message) ~ * .results-table {
        min-width: 0 !important;
        width: 100% !important;
        table-layout: auto !important;
    }
    
    .empty-message {
        text-align: center !important;
        width: 100% !important;
        display: table-cell !important;
        margin: 0 auto;
        font-size: 0.8rem !important;
    }
    
    .results-table tbody tr:has(.empty-message) {
        display: table-row;
        width: 100%;
    }
    
    .results-table tbody tr:has(.empty-message) td {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: center !important;
    }
    
    /* Fallback nếu :has() không được hỗ trợ - target trực tiếp với specificity cao */
    /* Override tất cả các rules cho các cột cụ thể khi có empty message */
    /* Sử dụng nhiều selector để tăng specificity và override tất cả các rules */
    .results-table tbody tr td.empty-message,
    .results-table tbody tr td.empty-message[colspan],
    .results-table tbody tr td.empty-message[colspan="13"],
    .results-table tbody tr:has(.empty-message) td.empty-message,
    .results-table tbody tr:has(.empty-message) td.empty-message:nth-child(1),
    .results-table tbody tr:has(.empty-message) td.empty-message:first-child,
    .results-table tbody tr td.empty-message:first-child,
    .results-table tbody tr td.empty-message:nth-child(1),
    .results-table tbody tr td.empty-message[colspan="13"]:first-child,
    .results-table tbody tr td.empty-message[colspan="13"]:nth-child(1) {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        text-align: center !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        /* Override tất cả các rules cho các cột cụ thể */
        position: static !important;
        left: auto !important;
        right: auto !important;
        background: transparent !important;
        box-shadow: none !important;
        z-index: auto !important;
    }
    
    /* Đảm bảo table container không có overflow khi có empty message */
    .results-table-container:has(.empty-message) {
        overflow-x: hidden !important;
    }
    
}

/* Context Menu - Đặt ngoài media query để áp dụng cho tất cả kích thước màn hình */
.context-menu {
    position: fixed !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 1px solid #e0e0e0;
    border-radius: clamp(8px, 1.2vw, 12px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: clamp(0.4rem, 0.8vw, 0.5rem);
    width: auto;
    min-width: auto;
    max-width: none;
    z-index: 10000 !important;
    display: none;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    transform: none !important;
    will-change: transform, opacity;
}

.context-menu-item {
    display: flex;
    align-items: center;
    gap: clamp(0.5rem, 1vw, 0.75rem);
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    color: var(--dropdown-option-text);
    font-size: clamp(0.8rem, 1.2vw, 0.9rem);
    font-weight: var(--form-control-font-weight, 400);
    line-height: 1.3;
    letter-spacing: 0.01em;
    margin: clamp(0.08rem, 0.15vw, 0.1rem);
    position: relative;
    will-change: transform, background-color, color;
    height: calc(0.5rem * 2 + 0.9rem * 1.2 + 2px);
    box-sizing: border-box;
    white-space: nowrap;
}

.context-menu-item > span:not(.context-menu-icon):not(.context-menu-arrow) {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.context-menu-item-danger {
    color: #dc3545;
    font-weight: 400;
}

.context-menu-item-danger:hover {
    background: linear-gradient(135deg, #fff5f5 0%, #ffe0e0 100%) !important;
    color: #c82333 !important;
    transform: translateX(2px) !important;
    box-shadow: 0 2px 4px rgba(220, 53, 69, 0.15);
}

.context-menu-icon {
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    width: clamp(18px, 2.5vw, 24px);
    min-width: clamp(18px, 2.5vw, 24px);
    height: clamp(18px, 2.5vw, 24px);
    padding: clamp(0.1rem, 0.2vw, 0.15rem);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    filter: grayscale(0.2);
    box-sizing: border-box;
}

.context-menu-icon-img {
    width: clamp(16px, 2.2vw, 20px);
    height: clamp(16px, 2.2vw, 20px);
    display: block;
    flex-shrink: 0;
}

.context-menu-item:hover .context-menu-icon {
    filter: grayscale(0);
    transform: none;
}

.context-menu-item-danger .context-menu-icon {
    filter: grayscale(0);
}

.context-menu-item-danger .context-menu-icon-img {
    filter: brightness(0) saturate(100%) invert(27%) sepia(95%) saturate(7158%) hue-rotate(346deg) brightness(92%) contrast(89%);
}

.context-menu-item-has-submenu {
    position: relative;
    padding: clamp(0.45rem, 1vw, 0.6rem);
    margin: clamp(0.08rem, 0.15vw, 0.1rem);
    overflow: visible !important;
    /* Tạo vùng mở rộng bên phải để dễ di chuyển chuột sang submenu */
    padding-right: clamp(0.8rem, 1.5vw, 1rem);
}

/* Tạo vùng bridge ảo giữa menu item và submenu để dễ di chuyển chuột */
.context-menu-item-has-submenu::after {
    content: '';
    position: absolute;
    right: calc(-1 * clamp(0.7rem, 1.2vw, 0.9rem));
    top: -0.35rem;
    bottom: -0.35rem;
    width: clamp(0.9rem, 1.5vw, 1.1rem);
    z-index: 10000;
    pointer-events: auto;
}

.context-menu-arrow {
    margin-left: auto;
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    color: #666;
}

.context-menu-item-has-submenu:hover .context-menu-arrow {
    transform: translateX(4px);
    color: var(--primary);
}

.context-menu-item-has-submenu.submenu-visible .context-menu-arrow {
    transform: translateX(4px);
    color: var(--primary);
}

.context-menu-submenu {
    position: absolute;
    left: 100%;
    top: 0;
    margin-left: 0;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: clamp(8px, 1.2vw, 12px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: clamp(0.4rem, 0.8vw, 0.5rem);
    width: auto;
    min-width: auto;
    max-width: none;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-10px);
    pointer-events: none;
    z-index: 10001;
    box-sizing: border-box;
    /* Tạo vùng buffer để dễ di chuyển chuột - mở rộng submenu về phía trên và dưới */
    margin-top: -0.4rem;
    margin-bottom: -0.4rem;
    /* Tạo vùng bridge bên trái để dễ di chuyển chuột từ menu item */
    padding-left: clamp(0.6rem, 1.2vw, 0.8rem);
}

#copySubmenu {
    min-width: 230px;
    max-height: min(72vh, 620px);
    overflow-y: auto;
    overscroll-behavior: contain;
}

#copySubmenu.copy-custom-view {
    width: min(520px, calc(100vw - 64px));
    min-width: min(520px, calc(100vw - 64px));
}

#copySubmenu::-webkit-scrollbar {
    width: 6px;
}

#copySubmenu::-webkit-scrollbar-track {
    background: transparent;
}

#copySubmenu::-webkit-scrollbar-thumb {
    background: #cfd7e3;
    border-radius: 999px;
}

.context-menu-submenu[style*="right"] {
    left: auto;
    margin-right: 0 !important;
    transform: translateX(10px);
}

.context-menu-submenu[style*="right"]:hover,
.context-menu-item-has-submenu:hover .context-menu-submenu[style*="right"] {
    transform: translateX(0);
}

.context-menu-item-has-submenu:hover .context-menu-submenu,
.context-menu-item-has-submenu.submenu-visible .context-menu-submenu,
.context-menu-submenu:hover {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    pointer-events: auto;
}

.context-menu-submenu-item {
    padding: clamp(0.4rem, 0.9vw, 0.55rem);
    cursor: pointer;
    color: var(--dropdown-option-text);
    font-size: clamp(0.8rem, 1.2vw, 0.9rem);
    font-weight: var(--form-control-font-weight, 400);
    line-height: 1.3;
    letter-spacing: 0.01em;
    margin: 0;
    position: relative;
    min-height: clamp(30px, 3.8vw, 34px);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: clamp(0.5rem, 1vw, 0.75rem);
    white-space: nowrap;
    box-sizing: border-box;
}

.context-menu-submenu-item span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.context-menu-submenu-caption {
    padding: 0.35rem 0.55rem 0.25rem;
    color: #6b7280;
    font-size: 0.76rem;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.copy-default-menu {
    display: block;
}

.copy-custom-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.45rem;
}

.copy-custom-title-group {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.copy-custom-header .context-menu-submenu-caption {
    padding: 0;
}

.copy-custom-back-button {
    width: 28px;
    height: 28px;
    min-width: 28px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--control-placeholder);
    cursor: pointer;
}

.copy-custom-back-icon {
    width: 16px;
    height: 16px;
    display: block;
    color: currentColor;
    stroke: currentColor;
    filter: none !important;
}

.copy-custom-back-button:hover {
    color: var(--primary);
}

.copy-custom-back-button:hover .copy-custom-back-icon {
    filter: none !important;
}

.copy-custom-select-all {
    flex: 0 0 auto;
    min-height: 28px;
    padding: 0.34rem 0.5rem;
    border: 1px solid transparent;
    background: transparent;
    background-color: transparent;
    background-image: none;
}

.context-menu-submenu-preview {
    max-width: 260px;
    margin: 0.35rem 0.1rem;
    padding: 0.45rem 0.55rem;
    border: 1px solid var(--dropdown-border);
    border-radius: 8px;
    background: var(--surface-muted-bg);
    color: var(--dropdown-option-text);
    font-size: 0.78rem;
    font-weight: 400;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.copy-custom-format-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--form-control-height);
    align-items: center;
    gap: 0;
    min-height: var(--form-control-height);
    margin: 0.35rem 0.1rem 0.5rem;
    border: 1px solid var(--results-options-border);
    border-radius: var(--form-control-radius);
    background: var(--results-options-muted);
    overflow: hidden;
    box-sizing: border-box;
}

.copy-custom-format-row .context-menu-submenu-preview {
    max-width: none;
    margin: 0;
    min-height: var(--form-control-height);
    padding: 0 0.55rem;
    display: flex;
    align-items: center;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
}

.copy-custom-icon-button {
    width: var(--form-control-height);
    height: 100%;
    min-height: var(--form-control-height);
    min-width: var(--form-control-height);
    margin: 0;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0 !important;
    border-left: 1px solid var(--results-options-border) !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    color: var(--primary) !important;
    cursor: pointer;
    box-shadow: none;
    transform: none;
}

.copy-custom-icon-button:hover {
    background: var(--button-flat-hover-bg) !important;
    background-color: var(--button-flat-hover-bg) !important;
    border-color: var(--button-flat-hover-border) !important;
    color: var(--button-flat-hover-text) !important;
    transform: none;
    box-shadow: none;
}

.copy-custom-icon-img {
    width: 16px;
    height: 16px;
    display: block;
    color: currentColor;
    stroke: currentColor;
    filter: none !important;
}

.context-menu-icon-settings {
    filter: brightness(0) saturate(100%) invert(41%) sepia(6%) saturate(726%) hue-rotate(176deg) brightness(91%) contrast(88%);
}

#copyCustomOptionsToggle .context-menu-icon {
    filter: none;
}

#copyCustomOptionsToggle .context-menu-icon-settings {
    filter: brightness(0) saturate(100%) invert(39%) sepia(77%) saturate(2884%) hue-rotate(202deg) brightness(98%) contrast(93%);
}

.context-menu-submenu-item:hover .context-menu-icon-settings,
#copyCustomOptionsToggle.submenu-open .context-menu-icon-settings {
    filter: brightness(0) saturate(100%) invert(39%) sepia(77%) saturate(2884%) hue-rotate(202deg) brightness(98%) contrast(93%);
}

#copyCustomOptionsToggle.submenu-open .context-menu-arrow {
    transform: rotate(90deg);
}

.copy-custom-options-panel {
    width: 100%;
    margin-top: 0;
    padding: 0.45rem;
    border-top: 0;
    box-sizing: border-box;
}

.copy-custom-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.25rem;
}

.copy-custom-grid .context-menu-submenu-item {
    min-width: 0;
}

.copy-custom-grid .context-menu-submenu-item span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.context-menu-submenu-item-danger {
    color: #dc3545;
    font-weight: 400;
}

.context-menu-submenu-item-danger:hover {
    background: linear-gradient(135deg, #fff5f5 0%, #ffe0e0 100%);
    color: #c82333;
    transform: translateX(2px);
    box-shadow: 0 2px 4px rgba(220, 53, 69, 0.15);
}

.context-menu-submenu-item .context-menu-icon {
    filter: grayscale(0.2);
}

.context-menu-submenu-item:hover .context-menu-icon {
    filter: grayscale(0);
    transform: none;
}

.context-menu-submenu-item-danger .context-menu-icon {
    filter: grayscale(0);
}

.context-menu-submenu-item-danger .context-menu-icon-img {
    filter: brightness(0) saturate(100%) invert(27%) sepia(95%) saturate(7158%) hue-rotate(346deg) brightness(92%) contrast(89%);
}

/* Filter checkmark */
.filter-checkmark,
.date-checkmark,
.method-checkmark {
    margin-left: auto;
    color: var(--primary);
    font-weight: 400;
    font-size: clamp(0.9rem, 1.3vw, 1rem);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .context-menu {
        width: auto;
        min-width: auto;
        max-width: none;
        padding: clamp(0.35rem, 1vw, 0.4rem);
        border-radius: clamp(6px, 1.5vw, 10px);
    }

    .context-menu-item {
        padding: 0.4rem 0.5rem;
        font-size: clamp(0.75rem, 2vw, 0.85rem);
        gap: clamp(0.4rem, 1.2vw, 0.6rem);
        margin: clamp(0.06rem, 0.25vw, 0.08rem);
        height: calc(0.4rem * 2 + 0.8rem * 1.2 + 2px);
        box-sizing: border-box;
    }
    
    .context-menu-item-has-submenu {
        padding: 0.4rem 0.5rem;
        margin: clamp(0.06rem, 0.25vw, 0.08rem);
        height: calc(0.4rem * 2 + 0.8rem * 1.2 + 2px);
        box-sizing: border-box;
    }

    .context-menu-icon {
        font-size: clamp(0.9rem, 2.2vw, 1.1rem);
        width: clamp(16px, 3.5vw, 20px);
        min-width: clamp(16px, 3.5vw, 20px);
        height: clamp(16px, 3.5vw, 20px);
        padding: clamp(0.08rem, 0.15vw, 0.12rem);
        box-sizing: border-box;
    }

    .context-menu-icon-img {
        width: clamp(14px, 3vw, 18px);
        height: clamp(14px, 3vw, 18px);
    }

    .context-menu-arrow {
        font-size: clamp(0.9rem, 2.2vw, 1.1rem);
    }

    .context-menu-submenu {
        width: auto;
        min-width: auto;
        max-width: none;
        padding: clamp(0.35rem, 1vw, 0.4rem);
        margin-left: clamp(0.25rem, 0.8vw, 0.3rem);
        border-radius: clamp(6px, 1.5vw, 10px);
        box-sizing: border-box;
    }

    .context-menu-submenu-item {
        padding: clamp(0.35rem, 1vw, 0.5rem);
        font-size: clamp(0.75rem, 2vw, 0.85rem);
        margin: 0;
        min-height: clamp(26px, 5vw, 30px);
    }

}

/* ==================== Dark Mode ==================== */
html.dark-mode .results-summary-card,
body.dark-mode .results-summary-card {
    background: var(--surface-bg);
    box-shadow: var(--surface-shadow-soft);
}

html.dark-mode .summary-item,
body.dark-mode .summary-item {
    background: linear-gradient(135deg, var(--surface-muted-bg) 0%, var(--surface-bg) 100%);
}

html.dark-mode .summary-item.clickable-stat:hover,
body.dark-mode .summary-item.clickable-stat:hover {
    background: linear-gradient(135deg, var(--surface-hover-bg) 0%, var(--surface-muted-bg) 100%);
}

html.dark-mode .summary-label,
body.dark-mode .summary-label {
    color: var(--control-placeholder);
}

html.dark-mode .summary-value,
body.dark-mode .summary-value {
    color: var(--primary);
}

body.dark-mode .table-empty {
    color: #b0b0b0;
}

body.dark-mode .btn-column-settings {
    background-color: var(--control-bg) !important;
    border-color: var(--control-border) !important;
    color: var(--control-text) !important;
}

body.dark-mode .btn-column-settings.active,
body.dark-mode .btn-column-settings:hover {
    border-color: var(--primary) !important;
}

body.dark-mode .btn-column-settings-icon:hover,
body.dark-mode .btn-column-settings-icon.active {
    background: transparent;
}

body.dark-mode .column-settings-menu {
    background: var(--dropdown-bg);
    border-color: var(--dropdown-border);
    box-shadow: var(--dropdown-shadow);
}

body.dark-mode .column-settings-item {
    color: var(--dropdown-option-text);
}

body.dark-mode .column-settings-select-all {
    background: var(--surface-muted-bg);
    border-color: var(--surface-border);
}

body.dark-mode .column-settings-summary {
    background: var(--surface-muted-bg);
    border-color: var(--surface-border);
    color: var(--control-text);
}

body.dark-mode .context-menu {
    background: var(--dropdown-bg) !important;
    border-color: var(--dropdown-border);
    box-shadow: var(--dropdown-shadow);
}

body.dark-mode .context-menu-item {
    color: var(--dropdown-option-text);
}

body.dark-mode .context-menu-submenu {
    background: var(--dropdown-bg);
    border-color: var(--dropdown-border);
    box-shadow: var(--dropdown-shadow);
}

body.dark-mode .context-menu-submenu-item {
    color: var(--dropdown-option-text);
}

body.dark-mode #copySubmenu::-webkit-scrollbar-thumb {
    background: #5a5a5a;
}

body.dark-mode .context-menu-submenu-caption {
    color: #a7b0bd;
}

body.dark-mode .context-menu-submenu-preview {
    background: var(--control-bg);
    border-color: var(--control-border);
    color: var(--control-text);
}

body.dark-mode .copy-custom-icon-button {
    background: transparent !important;
    background-color: transparent !important;
    border-color: var(--primary) !important;
    color: var(--primary) !important;
}

body.dark-mode .copy-custom-icon-button:hover {
    background: var(--button-flat-hover-bg) !important;
    background-color: var(--button-flat-hover-bg) !important;
    background-image: none !important;
    border-color: var(--button-flat-hover-border) !important;
    color: var(--button-flat-hover-text) !important;
}

body.dark-mode .copy-custom-select-all {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
}

body.dark-mode .context-menu-icon-settings {
    filter: brightness(0) invert(0.85);
}

body.dark-mode #copyCustomOptionsToggle .context-menu-icon {
    filter: none;
}

body.dark-mode #copyCustomOptionsToggle .context-menu-icon-settings {
    filter: brightness(0) saturate(100%) invert(39%) sepia(77%) saturate(2884%) hue-rotate(202deg) brightness(98%) contrast(93%);
}

body.dark-mode .context-menu-submenu-item:hover .context-menu-icon-settings,
body.dark-mode #copyCustomOptionsToggle.submenu-open .context-menu-icon-settings {
    filter: brightness(0) saturate(100%) invert(39%) sepia(77%) saturate(2884%) hue-rotate(202deg) brightness(98%) contrast(93%);
}

body.dark-mode .copy-custom-options-panel {
    border-top-color: var(--dropdown-border);
}

body.dark-mode .filter-container-inline .filter-group label,
body.dark-mode .date-range-label,
body.dark-mode .date-checkbox-label,
body.dark-mode .filter-group label,
body.dark-mode .filter-buttons label {
    color: var(--control-text);
}

/* Giữ nguyên màu status badge trong dark mode */
body.dark-mode .status-badge-table.success {
    color: #28a745 !important;
}

body.dark-mode .status-badge-table.failed {
    color: #dc3545 !important;
}

.filter-date-input {
    height: var(--form-control-height);
    min-height: var(--form-control-height);
    padding-top: 0;
    padding-bottom: 0;
    box-sizing: border-box;
}

/* ==================== Final Shared Results UI Lock ==================== */
.context-menu #copyCustomOptionsToggle.submenu-open,
.context-menu #copyCustomOptionsToggle.submenu-open:hover,
body.dark-mode .context-menu #copyCustomOptionsToggle.submenu-open,
body.dark-mode .context-menu #copyCustomOptionsToggle.submenu-open:hover {
    background: var(--dropdown-option-selected-bg) !important;
    background-color: var(--dropdown-option-selected-bg) !important;
    border-left-color: var(--primary) !important;
    color: var(--dropdown-option-hover-text) !important;
    transform: none !important;
    box-shadow: none !important;
}

.context-menu [data-action="delete-failed"],
.context-menu [data-action="delete-all"],
body.dark-mode .context-menu [data-action="delete-failed"],
body.dark-mode .context-menu [data-action="delete-all"] {
    color: var(--button-danger) !important;
}

.context-menu .context-menu-submenu-item[data-action="delete-failed"],
.context-menu .context-menu-submenu-item[data-action="delete-failed"]:hover,
.context-menu .context-menu-submenu-item[data-action="delete-failed"]:hover span,
body.dark-mode .context-menu .context-menu-submenu-item[data-action="delete-failed"],
body.dark-mode .context-menu .context-menu-submenu-item[data-action="delete-failed"]:hover,
body.dark-mode .context-menu .context-menu-submenu-item[data-action="delete-failed"]:hover span {
    color: var(--button-danger) !important;
}

.context-menu [data-action="delete-failed"] .context-menu-icon-img,
.context-menu [data-action="delete-all"] .context-menu-icon-img,
body.dark-mode .context-menu [data-action="delete-failed"] .context-menu-icon-img,
body.dark-mode .context-menu [data-action="delete-all"] .context-menu-icon-img {
    filter: brightness(0) saturate(100%) invert(31%) sepia(95%) saturate(1865%) hue-rotate(334deg) brightness(93%) contrast(86%) !important;
}

.results-table.results-table tbody tr:has(.empty-message),
.results-table.results-table tbody tr:has(.empty-message):hover,
.results-table.results-table tbody tr:has(.empty-message) > td,
.results-table.results-table tbody tr:has(.empty-message):hover > td,
.results-table.results-table tbody tr:has(.empty-message) > td.empty-message,
.results-table.results-table tbody tr:has(.empty-message):hover > td.empty-message,
.results-table.results-table tbody tr > td.empty-message,
.results-table.results-table tbody tr > td.empty-message:hover,
body.dark-mode .results-table.results-table tbody tr:has(.empty-message),
body.dark-mode .results-table.results-table tbody tr:has(.empty-message):hover,
body.dark-mode .results-table.results-table tbody tr:has(.empty-message) > td,
body.dark-mode .results-table.results-table tbody tr:has(.empty-message):hover > td,
body.dark-mode .results-table.results-table tbody tr:has(.empty-message) > td.empty-message,
body.dark-mode .results-table.results-table tbody tr:has(.empty-message):hover > td.empty-message,
body.dark-mode .results-table.results-table tbody tr > td.empty-message,
body.dark-mode .results-table.results-table tbody tr > td.empty-message:hover {
    --results-row-bg: var(--table-row-bg);
    background: var(--table-row-bg) !important;
    background-color: var(--table-row-bg) !important;
    box-shadow: none !important;
    cursor: default !important;
}

.results-table-container:has(.empty-message) {
    border-top: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
    border-bottom: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
}

.results-table.results-table:has(.empty-message) {
    width: 100% !important;
    min-width: 100% !important;
    table-layout: auto !important;
    border-color: var(--shared-table-border-color) !important;
}

.results-table.results-table tbody tr > td.empty-message,
.results-table.results-table tbody tr > td.empty-message[colspan],
body.dark-mode .results-table.results-table tbody tr > td.empty-message,
body.dark-mode .results-table.results-table tbody tr > td.empty-message[colspan] {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    padding: 2rem 1rem !important;
    text-align: center !important;
    vertical-align: middle !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    display: table-cell !important;
    border-right: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
    border-bottom: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
    color: var(--control-placeholder) !important;
}

.results-table.results-table th:not([data-column="status"]):not(:last-child),
.results-table.results-table td:not([data-column="status"]):not(:last-child):not(.empty-message),
body.dark-mode .results-table.results-table th:not([data-column="status"]):not(:last-child),
body.dark-mode .results-table.results-table td:not([data-column="status"]):not(:last-child):not(.empty-message) {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.results-table.results-table th[data-column="status"],
.results-table.results-table th:last-child,
body.dark-mode .results-table.results-table th[data-column="status"],
body.dark-mode .results-table.results-table th:last-child {
    position: sticky !important;
    right: 0 !important;
    z-index: 120 !important;
    overflow: hidden !important;
    background-clip: border-box !important;
    isolation: isolate !important;
    contain: paint !important;
}

.results-table.results-table td[data-column="status"]:not(.empty-message),
.results-table.results-table td:last-child:not(.empty-message),
body.dark-mode .results-table.results-table td[data-column="status"]:not(.empty-message),
body.dark-mode .results-table.results-table td:last-child:not(.empty-message) {
    position: sticky !important;
    right: 0 !important;
    z-index: 100 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    background-clip: border-box !important;
    isolation: isolate !important;
    contain: paint !important;
}

.results-table.results-table td[data-column="status"] .status-badge-table,
.results-table.results-table td:last-child .status-badge-table,
body.dark-mode .results-table.results-table td[data-column="status"] .status-badge-table,
body.dark-mode .results-table.results-table td:last-child .status-badge-table {
    display: inline-block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    position: relative !important;
    z-index: 2 !important;
}

.results-table.results-table th,
.results-table.results-table td:not(.empty-message),
body.dark-mode .results-table.results-table th,
body.dark-mode .results-table.results-table td:not(.empty-message) {
    border-bottom-width: var(--shared-table-border-width) !important;
    border-bottom-style: solid !important;
    border-bottom-color: var(--shared-table-border-color) !important;
    border-right-width: var(--shared-table-border-width) !important;
    border-right-style: solid !important;
    border-right-color: var(--shared-table-border-color) !important;
    box-shadow: none !important;
}

.results-table.results-table tbody tr:last-child > td:not(.empty-message),
body.dark-mode .results-table.results-table tbody tr:last-child > td:not(.empty-message) {
    border-bottom: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
}

.results-table.results-table th:nth-child(1),
.results-table.results-table td:nth-child(1):not(.empty-message),
body.dark-mode .results-table.results-table th:nth-child(1),
body.dark-mode .results-table.results-table td:nth-child(1):not(.empty-message) {
    border-right: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
}

.results-table.results-table th[data-column="status"],
.results-table.results-table td[data-column="status"]:not(.empty-message),
body.dark-mode .results-table.results-table th[data-column="status"],
body.dark-mode .results-table.results-table td[data-column="status"]:not(.empty-message) {
    border-left: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
    border-right: 0 !important;
    border-bottom: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
}

/* Shared option panel: column visibility and custom copy format use one style path. */
.results-options-panel {
    --results-options-panel-bg: var(--dropdown-bg);
    --results-options-border: var(--dropdown-border);
    --results-options-muted: var(--surface-muted-bg);
    --results-options-text: var(--dropdown-option-text);
    --results-options-title: var(--control-text);
    --results-options-item-hover: var(--dropdown-option-hover-bg);
    background: var(--results-options-panel-bg) !important;
    border-color: var(--results-options-border) !important;
    color: var(--results-options-text) !important;
}

.results-options-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.45rem;
}

.results-options-title {
    color: var(--results-options-title) !important;
    font-size: 0.76rem;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.results-options-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
}

.results-options-panel .results-options-select-all,
.results-options-panel .results-options-select-all:hover,
.results-options-panel .results-options-select-all:focus,
.results-options-panel .results-options-select-all:focus-visible,
.results-options-panel .results-options-select-all:active,
.context-menu .results-options-panel .context-menu-submenu-item.results-options-select-all,
.context-menu .results-options-panel .context-menu-submenu-item.results-options-select-all:hover,
.context-menu .results-options-panel .context-menu-submenu-item.results-options-select-all:focus,
.context-menu .results-options-panel .context-menu-submenu-item.results-options-select-all:focus-visible,
.context-menu .results-options-panel .context-menu-submenu-item.results-options-select-all:active,
body.dark-mode .results-options-panel .results-options-select-all,
body.dark-mode .results-options-panel .results-options-select-all:hover,
body.dark-mode .results-options-panel .results-options-select-all:focus,
body.dark-mode .results-options-panel .results-options-select-all:focus-visible,
body.dark-mode .results-options-panel .results-options-select-all:active,
body.dark-mode .context-menu .results-options-panel .context-menu-submenu-item.results-options-select-all,
body.dark-mode .context-menu .results-options-panel .context-menu-submenu-item.results-options-select-all:hover,
body.dark-mode .context-menu .results-options-panel .context-menu-submenu-item.results-options-select-all:focus,
body.dark-mode .context-menu .results-options-panel .context-menu-submenu-item.results-options-select-all:focus-visible,
body.dark-mode .context-menu .results-options-panel .context-menu-submenu-item.results-options-select-all:active {
    flex: 0 0 auto;
    min-height: 28px;
    margin: 0;
    padding: 0.34rem 0.5rem;
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    color: var(--results-options-text) !important;
}

.results-options-panel .results-options-select-all *,
.results-options-panel .results-options-select-all:hover *,
.results-options-panel .results-options-select-all:focus *,
.results-options-panel .results-options-select-all:active *,
body.dark-mode .results-options-panel .results-options-select-all *,
body.dark-mode .results-options-panel .results-options-select-all:hover *,
body.dark-mode .results-options-panel .results-options-select-all:focus *,
body.dark-mode .results-options-panel .results-options-select-all:active * {
    color: inherit !important;
}

.context-menu,
.context-menu-submenu,
body.dark-mode .context-menu,
body.dark-mode .context-menu-submenu {
    background: var(--dropdown-bg) !important;
    background-color: var(--dropdown-bg) !important;
}

.context-menu .context-menu-item,
.context-menu .context-menu-submenu-item,
body.dark-mode .context-menu .context-menu-item,
body.dark-mode .context-menu .context-menu-submenu-item {
}

.context-menu [data-action="delete-failed"],
.context-menu [data-action="delete-failed"]:hover,
.context-menu [data-action="delete-failed"]:focus,
.context-menu [data-action="delete-failed"]:active,
body.dark-mode .context-menu [data-action="delete-failed"],
body.dark-mode .context-menu [data-action="delete-failed"]:hover,
body.dark-mode .context-menu [data-action="delete-failed"]:focus,
body.dark-mode .context-menu [data-action="delete-failed"]:active {
    background-image: none !important;
}

.results-options-summary {
    border-color: var(--results-options-border) !important;
    background: var(--results-options-muted) !important;
    color: var(--results-options-text) !important;
}

.results-page .context-menu .context-menu-arrow,
.results-page .context-menu .context-menu-item-danger .context-menu-arrow,
.results-page .context-menu .context-menu-submenu-item-danger .context-menu-arrow,
.results-page .context-menu #copyCustomOptionsToggle .context-menu-arrow,
.results-page .context-menu #copyCustomOptionsToggle.submenu-open:not(:hover) .context-menu-arrow {
    color: var(--dropdown-option-text) !important;
}

.results-page .context-menu .context-menu-item-has-submenu:hover > .context-menu-arrow,
.results-page .context-menu .context-menu-item-has-submenu.submenu-visible > .context-menu-arrow,
.results-page .context-menu .context-menu-submenu-item:hover > .context-menu-arrow,
.results-page .context-menu .context-menu-submenu-item.submenu-visible > .context-menu-arrow,
.results-page .context-menu #copyCustomOptionsToggle:hover .context-menu-arrow {
    color: var(--primary) !important;
}

/* Results row paint lock: one source for base, hover, selected, accent and borders. */
.results-table.results-table tbody tr:has(td[data-row-index]) {
    --results-row-bg: transparent;
    --results-row-text: var(--control-text);
    background: var(--table-row-bg) !important;
    box-shadow: none !important;
}

.results-table.results-table tbody tr:has(td[data-row-index]):hover {
    --results-row-bg: var(--left-menu-subnav-hover-bg);
    --results-row-text: var(--dropdown-option-hover-text);
}

.results-table.results-table tbody tr.row-selected:has(td[data-row-index]),
.results-table.results-table tbody tr.row-selecting:has(td[data-row-index]) {
    --results-row-bg: var(--table-row-selected-bg);
    --results-row-text: var(--control-text);
}

.results-table.results-table tbody tr.row-selected:has(td[data-row-index]):hover,
.results-table.results-table tbody tr.row-selecting:has(td[data-row-index]):hover {
    --results-row-bg: var(--table-row-selected-hover-bg);
    --results-row-text: var(--dropdown-option-hover-text);
}

.results-table.results-table tbody tr:has(td[data-row-index]) > td[data-column]:not(.empty-message),
html.dark-mode .results-table.results-table tbody tr:has(td[data-row-index]) > td[data-column]:not(.empty-message),
body.dark-mode .results-table.results-table tbody tr:has(td[data-row-index]) > td[data-column]:not(.empty-message) {
    background-color: var(--table-row-bg) !important;
    background-image: linear-gradient(var(--results-row-bg), var(--results-row-bg)) !important;
    background-clip: border-box !important;
    border-radius: 0 !important;
    border-bottom: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
    border-right: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
    box-shadow: none !important;
    color: var(--results-row-text) !important;
}

.results-table.results-table tbody tr:has(td[data-row-index]) > td[data-column="stt"]:not(.empty-message),
.results-table.results-table tbody tr:has(td[data-row-index]) > td:first-child:not(.empty-message),
html.dark-mode .results-table.results-table tbody tr:has(td[data-row-index]) > td[data-column="stt"]:not(.empty-message),
html.dark-mode .results-table.results-table tbody tr:has(td[data-row-index]) > td:first-child:not(.empty-message),
body.dark-mode .results-table.results-table tbody tr:has(td[data-row-index]) > td[data-column="stt"]:not(.empty-message),
body.dark-mode .results-table.results-table tbody tr:has(td[data-row-index]) > td:first-child:not(.empty-message) {
    border-radius: 0 !important;
    border-right: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
}

.results-table.results-table tbody tr:is(:hover, .row-selected, .row-selecting):has(td[data-row-index]) > td[data-column="stt"]:not(.empty-message),
.results-table.results-table tbody tr:is(:hover, .row-selected, .row-selecting):has(td[data-row-index]) > td:first-child:not(.empty-message),
html.dark-mode .results-table.results-table tbody tr:is(:hover, .row-selected, .row-selecting):has(td[data-row-index]) > td[data-column="stt"]:not(.empty-message),
html.dark-mode .results-table.results-table tbody tr:is(:hover, .row-selected, .row-selecting):has(td[data-row-index]) > td:first-child:not(.empty-message),
body.dark-mode .results-table.results-table tbody tr:is(:hover, .row-selected, .row-selecting):has(td[data-row-index]) > td[data-column="stt"]:not(.empty-message),
body.dark-mode .results-table.results-table tbody tr:is(:hover, .row-selected, .row-selecting):has(td[data-row-index]) > td:first-child:not(.empty-message) {
    box-shadow: inset var(--row-accent-width) 0 0 var(--row-accent-color) !important;
}

.results-table.results-table tbody tr:has(td[data-row-index]) > td[data-column="status"]:not(.empty-message),
.results-table.results-table tbody tr:has(td[data-row-index]) > td:last-child:not(.empty-message),
html.dark-mode .results-table.results-table tbody tr:has(td[data-row-index]) > td[data-column="status"]:not(.empty-message),
html.dark-mode .results-table.results-table tbody tr:has(td[data-row-index]) > td:last-child:not(.empty-message),
body.dark-mode .results-table.results-table tbody tr:has(td[data-row-index]) > td[data-column="status"]:not(.empty-message),
body.dark-mode .results-table.results-table tbody tr:has(td[data-row-index]) > td:last-child:not(.empty-message) {
    border-left: var(--shared-table-border-width) solid var(--shared-table-border-color) !important;
    border-right: 0 !important;
    border-radius: 0 !important;
}

.results-table.results-table th[data-column="status"],
.results-table.results-table th:last-child,
html.dark-mode .results-table.results-table th[data-column="status"],
html.dark-mode .results-table.results-table th:last-child,
body.dark-mode .results-table.results-table th[data-column="status"],
body.dark-mode .results-table.results-table th:last-child {
    border-right: 0 !important;
}

/* Select-all header follows the shared popup interaction contract. */
.results-options-panel .results-options-header .results-options-select-all {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    color: var(--dropdown-option-text) !important;
    box-shadow: none !important;
    transform: none !important;
}

.results-options-panel .results-options-header .results-options-select-all:is(:hover, :focus-visible, :active) {
    background: var(--ui-interaction-hover-bg) !important;
    background-color: var(--ui-interaction-hover-bg) !important;
    border-left-color: var(--primary) !important;
}

/* Final custom-copy button lock: match shared outline button hover in light and dark. */
.context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button,
html.dark-mode .context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button,
body.dark-mode .context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-left: 1px solid var(--results-options-border) !important;
    border-radius: 0 !important;
    color: var(--primary) !important;
    box-shadow: none !important;
    transform: none !important;
}

.context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:hover,
.context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:focus-visible,
html.dark-mode .context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:hover,
html.dark-mode .context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:focus-visible,
body.dark-mode .context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:hover,
body.dark-mode .context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:focus-visible {
    background: var(--button-flat-hover-bg) !important;
    background-color: var(--button-flat-hover-bg) !important;
    background-image: none !important;
    border-color: var(--button-flat-hover-border) !important;
    color: var(--button-flat-hover-text) !important;
    box-shadow: none !important;
    transform: none !important;
}

.context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:hover .copy-custom-icon-img,
.context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:focus-visible .copy-custom-icon-img,
html.dark-mode .context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:hover .copy-custom-icon-img,
html.dark-mode .context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:focus-visible .copy-custom-icon-img,
body.dark-mode .context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:hover .copy-custom-icon-img,
body.dark-mode .context-menu .results-options-panel .copy-custom-format-row .copy-custom-icon-button.copy-custom-icon-button:focus-visible .copy-custom-icon-img {
    color: var(--button-flat-hover-text) !important;
    stroke: var(--button-flat-hover-text) !important;
    filter: none !important;
}

/* Final status-header icon lock: use theme text color by default, primary only on interaction. */
.results-table.results-table th[data-column="status"] .btn-column-settings-icon,
.results-table.results-table th.status-header-cell .btn-column-settings-icon,
html.dark-mode .results-table.results-table th[data-column="status"] .btn-column-settings-icon,
html.dark-mode .results-table.results-table th.status-header-cell .btn-column-settings-icon,
body.dark-mode .results-table.results-table th[data-column="status"] .btn-column-settings-icon,
body.dark-mode .results-table.results-table th.status-header-cell .btn-column-settings-icon {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    color: var(--control-text) !important;
    box-shadow: none !important;
    filter: none !important;
}

.results-table.results-table th[data-column="status"] .btn-column-settings-icon:hover,
.results-table.results-table th[data-column="status"] .btn-column-settings-icon:focus-visible,
.results-table.results-table th[data-column="status"] .btn-column-settings-icon.active,
.results-table.results-table th.status-header-cell .btn-column-settings-icon:hover,
.results-table.results-table th.status-header-cell .btn-column-settings-icon:focus-visible,
.results-table.results-table th.status-header-cell .btn-column-settings-icon.active,
html.dark-mode .results-table.results-table th[data-column="status"] .btn-column-settings-icon:hover,
html.dark-mode .results-table.results-table th[data-column="status"] .btn-column-settings-icon:focus-visible,
html.dark-mode .results-table.results-table th[data-column="status"] .btn-column-settings-icon.active,
html.dark-mode .results-table.results-table th.status-header-cell .btn-column-settings-icon:hover,
html.dark-mode .results-table.results-table th.status-header-cell .btn-column-settings-icon:focus-visible,
html.dark-mode .results-table.results-table th.status-header-cell .btn-column-settings-icon.active,
body.dark-mode .results-table.results-table th[data-column="status"] .btn-column-settings-icon:hover,
body.dark-mode .results-table.results-table th[data-column="status"] .btn-column-settings-icon:focus-visible,
body.dark-mode .results-table.results-table th[data-column="status"] .btn-column-settings-icon.active,
body.dark-mode .results-table.results-table th.status-header-cell .btn-column-settings-icon:hover,
body.dark-mode .results-table.results-table th.status-header-cell .btn-column-settings-icon:focus-visible,
body.dark-mode .results-table.results-table th.status-header-cell .btn-column-settings-icon.active {
    color: var(--primary) !important;
}

.results-table.results-table th[data-column="status"] .column-settings-icon-svg,
.results-table.results-table th[data-column="status"] .column-settings-icon-svg *,
.results-table.results-table th.status-header-cell .column-settings-icon-svg,
.results-table.results-table th.status-header-cell .column-settings-icon-svg *,
html.dark-mode .results-table.results-table th[data-column="status"] .column-settings-icon-svg,
html.dark-mode .results-table.results-table th[data-column="status"] .column-settings-icon-svg *,
html.dark-mode .results-table.results-table th.status-header-cell .column-settings-icon-svg,
html.dark-mode .results-table.results-table th.status-header-cell .column-settings-icon-svg *,
body.dark-mode .results-table.results-table th[data-column="status"] .column-settings-icon-svg,
body.dark-mode .results-table.results-table th[data-column="status"] .column-settings-icon-svg *,
body.dark-mode .results-table.results-table th.status-header-cell .column-settings-icon-svg,
body.dark-mode .results-table.results-table th.status-header-cell .column-settings-icon-svg * {
    color: currentColor !important;
    stroke: currentColor !important;
    filter: none !important;
}

.results-table.results-table th[data-column="status"] .btn-column-settings-icon.active .column-settings-icon-svg,
.results-table.results-table th.status-header-cell .btn-column-settings-icon.active .column-settings-icon-svg,
html.dark-mode .results-table.results-table th[data-column="status"] .btn-column-settings-icon.active .column-settings-icon-svg,
html.dark-mode .results-table.results-table th.status-header-cell .btn-column-settings-icon.active .column-settings-icon-svg,
body.dark-mode .results-table.results-table th[data-column="status"] .btn-column-settings-icon.active .column-settings-icon-svg,
body.dark-mode .results-table.results-table th.status-header-cell .btn-column-settings-icon.active .column-settings-icon-svg {
    transform: rotate(90deg) !important;
}

/* Custom-format select-all uses the same shared popup interaction contract. */
#copySubmenu.copy-custom-view #copyCustomOptionsPanel .copy-custom-select-all.results-options-select-all {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    color: var(--dropdown-option-text) !important;
    box-shadow: none !important;
    filter: none !important;
    outline: 0 !important;
    transform: none !important;
}

#copySubmenu.copy-custom-view #copyCustomOptionsPanel .copy-custom-select-all.results-options-select-all:is(:hover, :focus-visible, :active) {
    background: var(--ui-interaction-hover-bg) !important;
    background-color: var(--ui-interaction-hover-bg) !important;
    border-left-color: var(--primary) !important;
}

#copySubmenu.copy-custom-view #copyCustomOptionsPanel .copy-custom-select-all.results-options-select-all > span {
    color: inherit !important;
}

.results-page :is(
    .items-per-page-select,
    .items-per-page-custom-trigger,
    .items-per-page-custom-option,
    .page-info,
    .page-selector-item,
    .filter-date-input,
    .column-settings-item,
    .column-settings-summary,
    .context-menu-item,
    .context-menu-submenu-item
) {
    font-family: inherit !important;
    font-size: var(--form-control-font-size) !important;
    font-weight: var(--form-control-font-weight, 400) !important;
}