/* =============================================================================
   EXPOSURE MODULE - MODERN STYLING
   Consistent with dashboard, rovers, and users pages
   ============================================================================= */

/* =============================================================================
   PAGE CONTAINER
   ============================================================================= */

#exposure-summary-page {
    padding: 0px 24px;
    min-height: 100vh;
}

#exposure-details-page {
    padding: 0px 24px;
    min-height: 100vh;
}

/* =============================================================================
   NAVBAR - Matching rovers/users style
   ============================================================================= */

#exposure-summary-page .page-bar,
#exposure-details-page .page-bar {
    display: flex;
    align-items: center;
    padding: 12px 0;
    min-height: auto;
    border-bottom: none;
    margin-bottom: 12px;
    background: transparent !important;
}

#exposure-summary-page .mytitle,
#exposure-details-page .mytitle,
#exposure-summary-page .row.mytitle,
#exposure-details-page .row.mytitle {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: none !important;
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
}

#exposure-summary-page .mybar,
#exposure-details-page .mybar,
#exposure-summary-page .row.mybar,
#exposure-details-page .row.mybar {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 14px 0 !important;
    min-height: 60px !important;
    margin: 0 0 8px 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow: visible !important;
}

#exposure-summary-page .mybar .btn-bar,
#exposure-details-page .mybar .btn-bar {
    background: transparent !important;
    border: 1px solid rgba(48, 54, 61, 0.6) !important;
    color: #8b949e !important;
    padding: 8px 20px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    transition: all 0.15s ease !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    line-height: 1.4 !important;
}

#exposure-summary-page .mybar .btn-bar i,
#exposure-details-page .mybar .btn-bar i {
    font-size: 13px !important;
}

#exposure-summary-page .mybar .btn-bar:hover,
#exposure-details-page .mybar .btn-bar:hover {
    background: rgba(54, 127, 211, 0.1) !important;
    border-color: rgba(54, 127, 211, 0.3) !important;
    color: #e6edf3 !important;
}

#exposure-summary-page .mybar .btn-bar.active,
#exposure-details-page .mybar .btn-bar.active {
    background: rgba(54, 127, 211, 0.2) !important;
    border: 1px solid #367fd3 !important;
    color: #367fd3 !important;
}

/* =============================================================================
   STATS CARDS - Top row (4 columns)
   ============================================================================= */

.exp-stats-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 24px;
}

@media (max-width: 1200px) {
    .exp-stats-row {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .exp-stats-row {
        grid-template-columns: 1fr;
    }
}

.exp-stat-card {
    background: linear-gradient(135deg, rgba(30, 38, 50, 0.9) 0%, rgba(22, 28, 38, 0.95) 100%);
    border: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    border-radius: 10px;
    padding: 16px 20px;
    position: relative;
    overflow: hidden;
    transition: all 0.2s ease;
    cursor: pointer;
}

.exp-stat-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
    border-color: rgba(255, 255, 255, 0.15);
}

.exp-stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
}

.exp-stat-card--critical::before {
    background: linear-gradient(90deg, #f85149, #da3633);
}

.exp-stat-card--high::before {
    background: linear-gradient(90deg, #58a6ff, #388bfd);
}

.exp-stat-card--exploitable::before {
    background: linear-gradient(90deg, #f0883e, #d29922);
}

.exp-stat-card--endpoints::before {
    background: linear-gradient(90deg, #a371f7, #8957e5);
}

.exp-stat-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.exp-stat-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.exp-stat-card--critical .exp-stat-icon {
    background: rgba(248, 81, 73, 0.15);
    color: #f85149;
}

.exp-stat-card--high .exp-stat-icon {
    background: rgba(88, 166, 255, 0.15);
    color: #58a6ff;
}

.exp-stat-card--exploitable .exp-stat-icon {
    background: rgba(240, 136, 62, 0.15);
    color: #f0883e;
}

.exp-stat-card--endpoints .exp-stat-icon {
    background: rgba(163, 113, 247, 0.15);
    color: #a371f7;
}

.exp-stat-title {
    font-size: 11px;
    font-weight: 600;
    color: var(--db-text-muted, #6e7681);
    text-transform: uppercase;
    letter-spacing: 0.8px;
}

.exp-stat-values {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.exp-stat-item {
    flex: 1;
}

.exp-stat-item.text-right {
    text-align: right;
}

.exp-stat-value {
    font-size: 28px;
    font-weight: 700;
    color: var(--db-text-primary, #e6edf3);
    line-height: 1.1;
    cursor: pointer;
    transition: all 0.2s;
}

.exp-stat-value:hover {
    color: var(--db-accent-blue, #58a6ff);
    transform: scale(1.02);
}

.exp-stat-label {
    font-size: 11px;
    color: var(--db-text-muted, #6e7681);
    margin-top: 4px;
    font-weight: 500;
}

.exp-stat-single .exp-stat-value {
    font-size: 36px;
}

/* Warning badge */
.exp-stat-warning {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 600;
    margin-top: 8px;
    padding: 3px 8px;
    border-radius: 4px;
    background: rgba(248, 81, 73, 0.15);
    color: #f85149;
}

/* Loading state */
.exp-stat-loading {
    color: var(--db-accent-blue, #58a6ff);
    font-size: 24px;
}

/* =============================================================================
   ENDPOINT HEALTH CARD
   Shows vulnerable vs clean endpoints breakdown
   ============================================================================= */

.exp-endpoint-health-card {
    background: linear-gradient(135deg, rgba(30, 38, 50, 0.9) 0%, rgba(22, 28, 38, 0.95) 100%);
    border: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 28px;
}

.exp-endpoint-health-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.exp-endpoint-health-title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--db-text-primary, #e6edf3);
}

.exp-endpoint-health-title i {
    color: var(--db-accent-blue, #58a6ff);
    font-size: 16px;
}

.exp-endpoint-health-total {
    font-size: 13px;
    color: var(--db-text-muted, #6e7681);
}

.exp-endpoint-health-total span {
    font-weight: 700;
    color: var(--db-text-primary, #e6edf3);
}

.exp-endpoint-health-bar {
    display: flex;
    height: 24px;
    border-radius: 12px;
    overflow: hidden;
    background: var(--db-bg-tertiary, #21262d);
    margin-bottom: 16px;
}

.exp-endpoint-health-segment {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    transition: width 0.4s ease;
    min-width: 60px;
}

.exp-endpoint-health-segment--vulnerable {
    background: linear-gradient(90deg, #f85149, #da3633);
}

.exp-endpoint-health-segment--clean {
    background: linear-gradient(90deg, #3fb950, #2ea043);
}

.exp-endpoint-health-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

@media (max-width: 768px) {
    .exp-endpoint-health-stats {
        grid-template-columns: 1fr;
    }
}

.exp-endpoint-stat {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s;
}

.exp-endpoint-stat:hover {
    background: rgba(88, 166, 255, 0.08);
}

.exp-endpoint-stat-icon {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
}

.exp-endpoint-stat-icon--vulnerable {
    background: rgba(248, 81, 73, 0.15);
    color: #f85149;
}

.exp-endpoint-stat-icon--clean {
    background: rgba(63, 185, 80, 0.15);
    color: #3fb950;
}

.exp-endpoint-stat-content {
    flex: 1;
}

.exp-endpoint-stat-value {
    font-size: 28px;
    font-weight: 700;
    color: var(--db-text-primary, #e6edf3);
    line-height: 1.1;
}

.exp-endpoint-stat-label {
    font-size: 12px;
    color: var(--db-text-muted, #6e7681);
    margin-top: 4px;
}

.exp-endpoint-stat-percent {
    font-size: 24px;
    font-weight: 700;
    padding: 8px 12px;
    border-radius: 8px;
}

.exp-endpoint-stat-percent--vulnerable {
    background: rgba(248, 81, 73, 0.15);
    color: #f85149;
}

.exp-endpoint-stat-percent--clean {
    background: rgba(63, 185, 80, 0.15);
    color: #3fb950;
}

/* =============================================================================
   SEVERITY DISTRIBUTION BAR
   ============================================================================= */

.exp-severity-bar-container {
    margin-bottom: 24px;
}

.exp-severity-bar-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.exp-severity-bar-title {
    font-size: 12px;
    font-weight: 600;
    color: var(--db-text-secondary, #8b949e);
}

.exp-severity-bar-total {
    font-size: 12px;
    color: var(--db-text-muted, #6e7681);
}

.exp-severity-bar {
    display: flex;
    height: 10px;
    border-radius: 5px;
    overflow: hidden;
    background: var(--db-bg-tertiary, #21262d);
}

.exp-severity-bar-segment {
    height: 100%;
    transition: width 0.3s ease;
}

.exp-severity-bar-segment--critical {
    background: #f85149;
}

.exp-severity-bar-segment--high {
    background: #f0883e;
}

.exp-severity-bar-segment--medium {
    background: #d29922;
}

.exp-severity-bar-segment--low {
    background: #3fb950;
}

.exp-severity-legend {
    display: flex;
    gap: 20px;
    margin-top: 12px;
    flex-wrap: wrap;
}

.exp-severity-legend-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--db-text-secondary, #8b949e);
    cursor: pointer;
    transition: color 0.15s;
}

.exp-severity-legend-item:hover {
    color: var(--db-text-primary, #e6edf3);
}

.exp-severity-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 3px;
}

.exp-severity-legend-dot--critical {
    background: #f85149;
}

.exp-severity-legend-dot--high {
    background: #f0883e;
}

.exp-severity-legend-dot--medium {
    background: #d29922;
}

.exp-severity-legend-dot--low {
    background: #3fb950;
}

/* =============================================================================
   CONTENT GRID - Two column layout
   ============================================================================= */

.exp-content-grid {
    display: grid;
    grid-template-columns: 5fr 7fr;
    gap: 24px;
    margin-bottom: 24px;
}

@media (max-width: 1200px) {
    .exp-content-grid {
        grid-template-columns: 1fr;
    }
}

.exp-charts-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-bottom: 24px;
}

@media (max-width: 992px) {
    .exp-charts-grid {
        grid-template-columns: 1fr;
    }
}

/* =============================================================================
   CARD CONTAINERS
   ============================================================================= */

.exp-card {
    background: linear-gradient(135deg, rgba(30, 38, 50, 0.9) 0%, rgba(22, 28, 38, 0.95) 100%);
    border: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    border-radius: 12px;
    overflow: hidden;
}

.exp-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px;
    border-bottom: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    background: rgba(0, 0, 0, 0.25);
}

.exp-card-title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--db-text-primary, #e6edf3);
}

.exp-card-title i {
    color: var(--db-accent-blue, #58a6ff);
    font-size: 16px;
}

.exp-card-actions {
    display: flex;
    gap: 8px;
}

.exp-card-action-btn {
    background: transparent;
    border: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    color: var(--db-text-secondary, #8b949e);
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
}

.exp-card-action-btn:hover {
    background: rgba(88, 166, 255, 0.1);
    border-color: var(--db-accent-blue, #58a6ff);
    color: var(--db-accent-blue, #58a6ff);
}

.exp-card-body {
    padding: 24px;
}

.exp-card-body--no-padding {
    padding: 0;
}

/* =============================================================================
   VULNERABILITIES TABLE
   ============================================================================= */

.exp-table {
    width: 100%;
    border-collapse: collapse;
}

.exp-table thead th {
    background: rgba(17, 22, 29, 0.95);
    color: var(--db-text-secondary, #8b949e);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    padding: 14px 20px;
    text-align: left;
    border-bottom: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    position: sticky;
    top: 0;
}

.exp-table tbody tr {
    transition: background 0.15s;
}

.exp-table tbody tr:hover {
    background: rgba(88, 166, 255, 0.08);
}

.exp-table tbody td {
    padding: 14px 20px;
    border-bottom: 1px solid var(--db-border-muted, rgba(255, 255, 255, 0.05));
    color: var(--db-text-primary, #e6edf3);
    font-size: 13px;
}

.exp-table .cve-link {
    color: var(--db-accent-blue, #58a6ff);
    text-decoration: none;
    font-weight: 600;
    transition: all 0.15s;
}

.exp-table .cve-link:hover {
    text-decoration: underline;
    color: #79c0ff;
}

.exp-table .nvd-link {
    color: var(--db-text-muted, #6e7681);
    font-size: 14px;
    transition: color 0.15s;
}

.exp-table .nvd-link:hover {
    color: var(--db-accent-blue, #58a6ff);
}

/* Score badges */
.exp-score-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    padding: 5px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
}

.exp-score-badge--critical {
    background: rgba(248, 81, 73, 0.2);
    color: #f85149;
    border: 1px solid rgba(248, 81, 73, 0.4);
}

.exp-score-badge--high {
    background: rgba(240, 136, 62, 0.2);
    color: #f0883e;
    border: 1px solid rgba(240, 136, 62, 0.4);
}

.exp-score-badge--medium {
    background: rgba(210, 153, 34, 0.2);
    color: #d29922;
    border: 1px solid rgba(210, 153, 34, 0.4);
}

.exp-score-badge--low {
    background: rgba(63, 185, 80, 0.2);
    color: #3fb950;
    border: 1px solid rgba(63, 185, 80, 0.4);
}

/* Affected count badge */
.exp-affected-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(248, 81, 73, 0.1);
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    color: var(--db-text-primary, #e6edf3);
}

.exp-affected-badge i {
    color: var(--db-accent-red, #f85149);
    font-size: 10px;
}

/* KEV badge */
.exp-kev-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    background: rgba(240, 136, 62, 0.2);
    border: 1px solid rgba(240, 136, 62, 0.4);
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    color: #f0883e;
    text-transform: uppercase;
    margin-left: 8px;
}

/* Empty state */
.exp-table-empty {
    text-align: center;
    padding: 40px 20px;
    color: var(--db-text-muted, #6e7681);
}

.exp-table-empty i {
    font-size: 32px;
    margin-bottom: 12px;
    display: block;
    opacity: 0.5;
}

/* Loading state */
.exp-table-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
}

.exp-table-loading i {
    font-size: 24px;
    color: var(--db-accent-blue, #58a6ff);
}

/* =============================================================================
   CHARTS
   ============================================================================= */

.exp-chart-container {
    height: 360px;
    position: relative;
}

.exp-chart-container--tall {
    height: 420px;
}

.exp-chart-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
}

.exp-chart-loading i {
    font-size: 24px;
    color: var(--db-accent-blue, #58a6ff);
}

/* =============================================================================
   PAGINATION - Matching Rovers style (embedded in table)
   ============================================================================= */

.exp-table-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    border-top: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    background: rgba(0, 0, 0, 0.15);
}

.exp-pagination-info {
    font-size: 12px;
    color: var(--db-text-muted, #6e7681);
}

.exp-pagination-buttons {
    display: flex;
    gap: 8px;
}

.exp-pagination-btn {
    background: rgba(88, 166, 255, 0.1);
    border: 1px solid rgba(88, 166, 255, 0.3);
    color: var(--db-text-primary, #e6edf3);
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
}

.exp-pagination-btn:hover:not(:disabled) {
    background: rgba(88, 166, 255, 0.2);
    border-color: var(--db-accent-blue, #58a6ff);
}

.exp-pagination-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.exp-pagination-btn i {
    font-size: 10px;
}

/* Empty state improvements */
.exp-table-empty {
    text-align: center;
    padding: 60px 20px;
    color: var(--db-text-muted, #6e7681);
}

.exp-table-empty i {
    font-size: 48px;
    margin-bottom: 16px;
    display: block;
    opacity: 0.7;
}

/* =============================================================================
   BLUR EFFECT FOR LOADING
   ============================================================================= */

.exp-blur {
    filter: blur(2px);
    opacity: 0.6;
    pointer-events: none;
}

/* =============================================================================
   EXPOSURE DETAILS PAGE
   ============================================================================= */

#exposure-details-page {
    padding: 0 15px;
}

/* =============================================================================
   ACTIVE FILTERS BAR
   ============================================================================= */

.exp-active-filters-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 20px;
    background: rgba(88, 166, 255, 0.05);
    border: 1px solid rgba(88, 166, 255, 0.15);
    border-radius: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.exp-active-filters-label {
    font-size: 12px;
    font-weight: 600;
    color: var(--db-text-muted, #6e7681);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.exp-filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(88, 166, 255, 0.15);
    border: 1px solid rgba(88, 166, 255, 0.3);
    color: var(--db-accent-blue, #58a6ff);
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
}

.exp-filter-tag-title {
    color: var(--db-text-muted, #6e7681);
}

.exp-filter-tag-remove {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    font-size: 14px;
    padding: 0;
    margin-left: 4px;
    opacity: 0.7;
    transition: opacity 0.15s;
}

.exp-filter-tag-remove:hover {
    opacity: 1;
}

/* Filter tag severity variants */
.exp-filter-tag--critical {
    background: rgba(248, 81, 73, 0.15);
    border-color: rgba(248, 81, 73, 0.3);
    color: #f85149;
}

.exp-filter-tag--high {
    background: rgba(240, 136, 62, 0.15);
    border-color: rgba(240, 136, 62, 0.3);
    color: #f0883e;
}

.exp-filter-tag--medium {
    background: rgba(210, 153, 34, 0.15);
    border-color: rgba(210, 153, 34, 0.3);
    color: #d29922;
}

.exp-filter-tag--low {
    background: rgba(63, 185, 80, 0.15);
    border-color: rgba(63, 185, 80, 0.3);
    color: #3fb950;
}

/* Filter tag status variants */
.exp-filter-tag--status-active,
.exp-filter-tag--status-reopened {
    background: rgba(248, 81, 73, 0.15);
    border-color: rgba(248, 81, 73, 0.3);
    color: #f85149;
}

.exp-filter-tag--status-patched {
    background: rgba(63, 185, 80, 0.15);
    border-color: rgba(63, 185, 80, 0.3);
    color: #3fb950;
}

/* =============================================================================
   TOOLBAR
   ============================================================================= */

.exp-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.exp-toolbar-left {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.exp-toolbar-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Date picker button */
.exp-date-picker-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, rgba(30, 38, 50, 0.9) 0%, rgba(22, 28, 38, 0.95) 100%);
    border: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    color: var(--db-text-primary, #e6edf3);
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
}

.exp-date-picker-btn:hover {
    border-color: var(--db-accent-blue, #58a6ff);
    background: rgba(88, 166, 255, 0.05);
}

.exp-date-picker-btn i {
    color: var(--db-accent-blue, #58a6ff);
}

/* Toggle options (checkboxes) */
.exp-toggle-option {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    padding: 8px 14px;
    border-radius: 6px;
    background: transparent;
    border: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    transition: all 0.2s;
}

.exp-toggle-option:hover {
    background: rgba(88, 166, 255, 0.05);
    border-color: rgba(88, 166, 255, 0.3);
}

.exp-toggle-option.active {
    background: rgba(88, 166, 255, 0.1);
    border-color: var(--db-accent-blue, #58a6ff);
}

.exp-toggle-option input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--db-accent-blue, #58a6ff);
    cursor: pointer;
}

.exp-toggle-option label {
    font-size: 13px;
    color: var(--db-text-secondary, #8b949e);
    cursor: pointer;
    user-select: none;
}

.exp-toggle-option.active label {
    color: var(--db-accent-blue, #58a6ff);
}

/* Primary button */
.exp-btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #58a6ff 0%, #388bfd 100%);
    border: none;
    color: #fff;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
}

.exp-btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(88, 166, 255, 0.3);
    color: #fff;
}

.exp-btn-primary:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* =============================================================================
   FILTER COLUMNS
   ============================================================================= */

.exp-filters-container {
    background: linear-gradient(135deg, rgba(30, 38, 50, 0.9) 0%, rgba(22, 28, 38, 0.95) 100%);
    border: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 24px;
    overflow-x: auto;
}

.exp-filters-grid {
    display: flex;
    gap: 20px;
    min-width: max-content;
}

/* Custom scrollbar for filters container */
.exp-filters-container::-webkit-scrollbar {
    height: 6px;
}

.exp-filters-container::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 3px;
}

.exp-filters-container::-webkit-scrollbar-thumb {
    background: rgba(88, 166, 255, 0.3);
    border-radius: 3px;
}

.exp-filters-container::-webkit-scrollbar-thumb:hover {
    background: rgba(88, 166, 255, 0.5);
}

.exp-filter-column {
    min-width: 160px;
    flex: 1;
    position: relative;
}

/* Dropdown container for search results */
.exp-filter-dropdown-container {
    position: relative;
}

.exp-filter-column-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--db-border-muted, rgba(255, 255, 255, 0.05));
    height: 20px;
}

.exp-filter-column-title {
    font-size: 12px;
    font-weight: 600;
    color: var(--db-text-muted, #6e7681);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.exp-filter-column-search {
    width: 100%;
    background: rgba(88, 166, 255, 0.05);
    border: 1px solid rgba(88, 166, 255, 0.2);
    border-radius: 6px;
    padding: 8px 12px 8px 32px;
    font-size: 12px;
    color: var(--db-text-primary, #e6edf3);
    margin-bottom: 10px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2358a6ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 10px center;
}

.exp-filter-column-search:focus {
    outline: none;
    border-color: var(--db-accent-blue, #58a6ff);
    background-color: rgba(88, 166, 255, 0.08);
    box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.1);
}

.exp-filter-column-search::placeholder {
    color: rgba(138, 180, 248, 0.7);
}

/* Header search directive styling for filter columns */
#exposure-details-page .exp-filter-column .header-search {
    display: flex;
    align-items: center;
    cursor: pointer;
    height: 20px;
}

#exposure-details-page .exp-filter-column .header-search>span {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--db-accent-blue, #58a6ff);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    height: 20px;
    line-height: 20px;
}

#exposure-details-page .exp-filter-column .header-search>span i.fa-search {
    color: var(--db-accent-blue, #58a6ff);
    font-size: 12px;
}

#exposure-details-page .exp-filter-column .header-search>span span {
    color: var(--db-accent-blue, #58a6ff);
}

#exposure-details-page .exp-filter-column .header-search>div {
    display: flex;
    align-items: center;
    gap: 4px;
    width: 100%;
    min-width: 120px;
}

#exposure-details-page .exp-filter-column .header-search input {
    flex: 1;
    min-width: 0;
    background: rgba(88, 166, 255, 0.08);
    border: 1px solid rgba(88, 166, 255, 0.3);
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 12px;
    color: var(--db-text-primary, #e6edf3);
    outline: none;
}

#exposure-details-page .exp-filter-column .header-search input:focus {
    border-color: var(--db-accent-blue, #58a6ff);
    box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.15);
}

#exposure-details-page .exp-filter-column .header-search input::placeholder {
    color: rgba(138, 180, 248, 0.6);
    font-size: 12px;
}

#exposure-details-page .exp-filter-column .header-search button {
    background: rgba(88, 166, 255, 0.15);
    border: 1px solid rgba(88, 166, 255, 0.3);
    border-radius: 6px;
    padding: 6px 10px;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.15s;
}

#exposure-details-page .exp-filter-column .header-search button:hover {
    background: rgba(88, 166, 255, 0.25);
    border-color: var(--db-accent-blue, #58a6ff);
}

#exposure-details-page .exp-filter-column .header-search button i {
    color: var(--db-accent-blue, #58a6ff);
    font-size: 12px;
}

/* Search dropdown container */
#exposure-details-page .exp-filter-dropdown-container {
    position: absolute;
    top: 32px;
    left: 0;
    min-width: 100%;
    width: max-content;
    max-width: 280px;
    z-index: 99999;
}

/* Search results dropdown - modern styling */
#exposure-details-page .searchOnCve {
    position: relative !important;
    display: block;
    z-index: 9999;
    background: #1a1f27 !important;
    border: 1px solid rgba(88, 166, 255, 0.2) !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
    padding: 8px !important;
    margin: 0 !important;
    list-style: none !important;
    max-height: 220px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    width: 100% !important;
    min-width: 180px;
}

#exposure-details-page .searchOnCve li {
    margin: 0 !important;
    width: 100% !important;
    padding: 0;
    background: transparent !important;
    border-radius: 6px;
    transition: background 0.15s;
}

#exposure-details-page .searchOnCve li:hover {
    background: rgba(88, 166, 255, 0.1) !important;
}

#exposure-details-page .searchOnCve li.active {
    background: rgba(88, 166, 255, 0.15) !important;
}

#exposure-details-page .searchOnCve li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    color: var(--db-text-secondary, #8b949e) !important;
    text-decoration: none;
    font-size: 13px;
    cursor: pointer;
}

#exposure-details-page .searchOnCve li a:hover {
    color: var(--db-text-primary, #e6edf3) !important;
}

#exposure-details-page .searchOnCve li a span.elipsis {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: none !important;
    width: auto !important;
}

#exposure-details-page .searchOnCve li a span.pull-right {
    font-size: 12px;
    font-weight: 600;
    color: var(--db-text-muted, #6e7681);
    background: rgba(0, 0, 0, 0.3);
    padding: 2px 8px;
    border-radius: 10px;
    margin-left: 8px;
    float: none !important;
}

/* Loading state - keep background solid */
#exposure-details-page .searchOnCve.blur-viewStats {
    position: relative !important;
    background: #1a1f27 !important;
}

/* Blur only the content, not the container */
#exposure-details-page .searchOnCve.blur-viewStats>div,
#exposure-details-page .searchOnCve.blur-viewStats>li {
    opacity: 0.5;
    filter: blur(1px);
    pointer-events: none;
}

/* Loading indicator */
#exposure-details-page .searchOnCve.blur-viewStats::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 24px;
    height: 24px;
    border: 2px solid rgba(88, 166, 255, 0.2);
    border-top-color: var(--db-accent-blue, #58a6ff);
    border-radius: 50%;
    animation: exp-spin 0.8s linear infinite;
    z-index: 100;
}

@keyframes exp-spin {
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

/* SlimScroll wrapper inside search dropdowns - completely disable */
#exposure-details-page .searchOnCve .slimScrollDiv,
#exposure-details-page .searchOnCve>.slimScrollDiv {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    width: 100% !important;
    position: static !important;
}

#exposure-details-page .searchOnCve .slimScrollBar,
#exposure-details-page .searchOnCve .slimScrollRail,
#exposure-details-page .searchOnCve>.slimScrollDiv>.slimScrollBar,
#exposure-details-page .searchOnCve>.slimScrollDiv>.slimScrollRail {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* Hide the inner div that slimScroll creates */
#exposure-details-page .searchOnCve>div[id],
#exposure-details-page .searchOnCve .slimScrollDiv>div[id] {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    width: 100% !important;
}

/* Custom scrollbar for the dropdown - native only */
#exposure-details-page .searchOnCve::-webkit-scrollbar {
    width: 6px !important;
}

#exposure-details-page .searchOnCve::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2) !important;
    border-radius: 3px !important;
}

#exposure-details-page .searchOnCve::-webkit-scrollbar-thumb {
    background: rgba(88, 166, 255, 0.4) !important;
    border-radius: 3px !important;
}

#exposure-details-page .searchOnCve::-webkit-scrollbar-thumb:hover {
    background: rgba(88, 166, 255, 0.6) !important;
}

.exp-filter-items {
    max-height: 180px;
    overflow-y: auto;
}

.exp-filter-items::-webkit-scrollbar {
    width: 4px;
}

.exp-filter-items::-webkit-scrollbar-track {
    background: transparent;
}

.exp-filter-items::-webkit-scrollbar-thumb {
    background: var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    border-radius: 2px;
}

.exp-filter-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 10px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s;
    margin-bottom: 2px;
}

.exp-filter-item:hover {
    background: rgba(88, 166, 255, 0.08);
}

.exp-filter-item.active {
    background: rgba(88, 166, 255, 0.15);
}

.exp-filter-item-name {
    font-size: 13px;
    color: var(--db-text-secondary, #8b949e);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    margin-right: 8px;
    text-transform: capitalize;
}

.exp-filter-item.active .exp-filter-item-name {
    color: var(--db-accent-blue, #58a6ff);
    font-weight: 500;
}

.exp-filter-item-count {
    font-size: 12px;
    font-weight: 600;
    color: var(--db-text-muted, #6e7681);
    background: rgba(0, 0, 0, 0.2);
    padding: 2px 8px;
    border-radius: 10px;
    min-width: 32px;
    text-align: center;
}

.exp-filter-item.active .exp-filter-item-count {
    background: rgba(88, 166, 255, 0.2);
    color: var(--db-accent-blue, #58a6ff);
}

/* Severity colors in filter */
.exp-filter-item--critical .exp-filter-item-name {
    color: #f85149;
}

.exp-filter-item--high .exp-filter-item-name {
    color: #f0883e;
}

.exp-filter-item--medium .exp-filter-item-name {
    color: #d29922;
}

.exp-filter-item--low .exp-filter-item-name {
    color: #3fb950;
}

/* Status colors in filter */
.exp-filter-item--active .exp-filter-item-name {
    color: #f85149;
}

.exp-filter-item--reopened .exp-filter-item-name {
    color: #f0883e;
}

.exp-filter-item--patched .exp-filter-item-name {
    color: #3fb950;
}

.exp-filter-item--uninstalled .exp-filter-item-name {
    color: var(--db-text-muted, #6e7681);
}

/* =============================================================================
   DATA TABLE CONTAINER
   ============================================================================= */

.exp-data-table-container {
    background: linear-gradient(135deg, rgba(30, 38, 50, 0.9) 0%, rgba(22, 28, 38, 0.95) 100%);
    border: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    min-height: 400px;
}

.exp-data-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 1200px;
}

.exp-data-table thead th {
    background: rgba(17, 22, 29, 0.95);
    color: var(--db-text-secondary, #8b949e);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    padding: 14px 16px;
    text-align: left;
    border-bottom: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 5;
}

.exp-data-table thead th.text-center {
    text-align: center;
}

.exp-data-table thead th .fa-refresh {
    cursor: pointer;
    transition: color 0.15s;
}

.exp-data-table thead th .fa-refresh:hover {
    color: var(--db-accent-blue, #58a6ff);
}

.exp-data-table tbody tr {
    transition: background 0.15s;
}

.exp-data-table tbody tr:hover {
    background: rgba(88, 166, 255, 0.05);
}

.exp-data-table tbody tr.expanded {
    background: rgba(88, 166, 255, 0.08);
}

.exp-data-table tbody td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--db-border-muted, rgba(255, 255, 255, 0.05));
    color: var(--db-text-primary, #e6edf3);
    font-size: 13px;
    vertical-align: middle;
}

.exp-data-table tbody td.text-center {
    text-align: center;
}

/* Expand button */
.exp-expand-btn {
    background: var(--exp-expand-btn-bg, rgba(88, 166, 255, 0.1));
    border: 1px solid var(--exp-expand-btn-border, rgba(88, 166, 255, 0.2));
    color: var(--exp-expand-btn-color, #58a6ff);
    width: 28px;
    height: 28px;
    border-radius: 6px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
}

.exp-expand-btn:hover {
    background: rgba(88, 166, 255, 0.2);
    border-color: var(--db-accent-blue, #58a6ff);
}

/* Severity text colors */
.exp-severity-text--critical {
    color: #f85149;
    font-weight: 600;
}

.exp-severity-text--high {
    color: #f0883e;
    font-weight: 600;
}

.exp-severity-text--medium {
    color: #d29922;
    font-weight: 600;
}

.exp-severity-text--low {
    color: #3fb950;
    font-weight: 600;
}

/* Description text in table */
.exp-description-text {
    max-width: 400px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--theme-text-secondary, #add8e6);
    display: block;
}

/* CVE link styling */
#exposure-details-page .cve-link {
    color: var(--db-accent-blue, #58a6ff);
    text-decoration: none;
    font-weight: 600;
    transition: all 0.15s;
}

#exposure-details-page .cve-link:hover {
    text-decoration: underline;
    color: #79c0ff;
}

/* --- Copy-to-clipboard button (shared) --- */
.exp-copy-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    outline: none;
    background: transparent;
    color: var(--theme-text-muted, #6e7681);
    cursor: pointer;
    padding: 2px 4px;
    font-size: 11px;
    border-radius: 4px;
    transition: color 0.15s ease, background 0.15s ease;
    flex-shrink: 0;
}

.exp-copy-btn:hover {
    color: var(--theme-text-link, #58a6ff);
    background: var(--theme-bg-subtle, rgba(56, 139, 253, 0.12));
}

.exp-copy-btn--copied,
.exp-copy-btn--copied:hover {
    color: var(--theme-success, #3fb950) !important;
    background: var(--theme-success-bg, rgba(63, 185, 80, 0.12)) !important;
}

/* Show only on parent hover (CVE cell, endpoint cell) */
.exp-copy-btn--hover-only {
    opacity: 0;
    transition: opacity 0.15s ease, color 0.15s ease, background 0.15s ease;
}

.exp-cve-cell {
    position: relative;
    white-space: nowrap;
}

.exp-cve-cell:hover .exp-copy-btn--hover-only {
    opacity: 1;
}

#exposure-details-page .exp-drilldown-endpoint-cell:hover .exp-copy-btn--hover-only {
    opacity: 1;
}

/* Inline copy button in tooltip metadata rows */
.exp-copy-btn--inline {
    margin-left: 6px;
    opacity: 0.4;
    font-size: 10px;
    padding: 2px 3px;
}

.exp-copy-btn--inline:hover,
.exp-tt-ctx-meta-row:hover .exp-copy-btn--inline {
    opacity: 1;
}

/* Copy button in KB section headers */
.exp-copy-btn--header {
    margin-left: auto;
    opacity: 0.5;
    font-size: 11px;
    padding: 2px 6px;
}

.exp-copy-btn--header:hover {
    opacity: 1;
}

/* Vulnerable hosts */
.exp-vulnerable-hosts {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.exp-vulnerable-hosts-count {
    font-weight: 600;
}

.exp-vulnerable-hosts-eye {
    color: var(--db-text-muted, #6e7681);
    transition: all 0.15s;
}

.exp-vulnerable-hosts:hover .exp-vulnerable-hosts-eye {
    color: var(--db-accent-blue, #58a6ff);
}

/* Endpoint name in table */
.exp-endpoint-name {
    font-family: 'Monaco', 'Consolas', monospace;
    font-size: 12px;
    color: var(--db-text-secondary, #8b949e);
}

/* Status badge */
.exp-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
}

.exp-status-badge--active {
    background: rgba(248, 81, 73, 0.15);
    color: #f85149;
}

.exp-status-badge--reopened {
    background: rgba(240, 136, 62, 0.15);
    color: #f0883e;
}

.exp-status-badge--patched {
    background: rgba(63, 185, 80, 0.15);
    color: #3fb950;
}

.exp-status-badge--uninstalled {
    background: rgba(110, 118, 129, 0.15);
    color: #6e7681;
}

/* Vulnerable hosts indicator */
.exp-vulnerable-hosts {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.exp-vulnerable-hosts-count {
    font-weight: 600;
}

.exp-vulnerable-hosts-eye {
    color: var(--db-text-muted, #6e7681);
    transition: all 0.15s;
}

.exp-vulnerable-hosts:hover .exp-vulnerable-hosts-eye {
    color: var(--db-accent-blue, #58a6ff);
}

/* Description text */
.exp-description-text {
    max-width: 400px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--theme-text-secondary, #add8e6);
}

/* Endpoint name */
.exp-endpoint-name {
    font-family: 'Monaco', 'Consolas', monospace;
    font-size: 12px;
    color: var(--db-text-secondary, #8b949e);
}

/* =============================================================================
   EXPANDED DETAIL PANEL
   ============================================================================= */

.exp-detail-panel {
    background: rgba(0, 0, 0, 0.3);
    padding: 24px;
}

.exp-detail-panel-inner {
    background: linear-gradient(135deg, rgba(30, 38, 50, 0.9) 0%, rgba(22, 28, 38, 0.95) 100%);
    border: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    border-radius: 12px;
    overflow: hidden;
}

.exp-detail-panel-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    min-height: 600px;
}

@media (max-width: 1200px) {
    .exp-detail-panel-grid {
        grid-template-columns: 1fr;
    }
}

/* Left panel */
.exp-detail-left {
    padding: 24px;
    border-right: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
}

/* Right panel */
.exp-detail-right {
    padding: 24px;
    display: flex;
    flex-direction: column;
}

.exp-detail-section-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--db-text-primary, #e6edf3);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
}

.exp-detail-section-title i {
    color: var(--db-accent-blue, #58a6ff);
    font-size: 16px;
    background: rgba(88, 166, 255, 0.15);
    padding: 10px;
    border-radius: 8px;
}

.exp-detail-description {
    background: linear-gradient(135deg, rgba(88, 166, 255, 0.03) 0%, rgba(0, 0, 0, 0.2) 100%);
    border: 1px solid rgba(88, 166, 255, 0.1);
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 24px;
    line-height: 1.7;
    color: var(--db-text-secondary, #8b949e);
    font-size: 14px;
    max-height: 200px;
    overflow-y: auto;
    position: relative;
}

.exp-detail-description::before {
    content: '"';
    position: absolute;
    top: 10px;
    left: 12px;
    font-size: 36px;
    color: rgba(88, 166, 255, 0.2);
    font-family: Georgia, serif;
    line-height: 1;
}

.exp-detail-info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

@media (max-width: 768px) {
    .exp-detail-info-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.exp-detail-info-item {
    padding: 14px 16px;
    background: linear-gradient(135deg, rgba(88, 166, 255, 0.05) 0%, rgba(0, 0, 0, 0.15) 100%);
    border-radius: 10px;
    border-left: 3px solid rgba(88, 166, 255, 0.3);
    transition: all 0.2s ease;
}

.exp-detail-info-item:hover {
    background: linear-gradient(135deg, rgba(88, 166, 255, 0.08) 0%, rgba(0, 0, 0, 0.2) 100%);
    border-left-color: var(--db-accent-blue, #58a6ff);
}

.exp-detail-info-label {
    font-size: 10px;
    font-weight: 700;
    color: var(--db-accent-blue, #58a6ff);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.exp-detail-info-label::before {
    content: '';
    width: 3px;
    height: 12px;
    background: var(--db-accent-blue, #58a6ff);
    border-radius: 2px;
    opacity: 0.6;
}

.exp-detail-info-value {
    font-size: 14px;
    color: var(--db-text-primary, #e6edf3);
    font-weight: 500;
    word-break: break-word;
}

/* KEV Warning Panel */
.exp-kev-warning-panel {
    background: rgba(240, 136, 62, 0.1);
    border: 1px solid rgba(240, 136, 62, 0.3);
    border-radius: 10px;
    padding: 16px 20px;
    margin-bottom: 24px;
}

.exp-kev-warning-header {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #f0883e;
    margin-bottom: 12px;
}

.exp-kev-warning-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* Remediation Panel */
.exp-remediation-panel {
    background: rgba(88, 166, 255, 0.08);
    border: 1px solid rgba(88, 166, 255, 0.2);
    border-radius: 10px;
    padding: 16px 20px;
    margin-bottom: 24px;
}

.exp-remediation-header {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--db-accent-blue, #58a6ff);
    margin-bottom: 12px;
}

.exp-remediation-text {
    font-size: 13px;
    color: var(--db-text-secondary, #8b949e);
    line-height: 1.6;
}

.exp-remediation-link {
    color: var(--db-accent-blue, #58a6ff);
    text-decoration: none;
    word-break: break-all;
}

.exp-remediation-link:hover {
    text-decoration: underline;
}

/* NVD Link section */
.exp-nvd-section {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--db-text-muted, #6e7681);
}

.exp-nvd-section a {
    color: var(--db-accent-blue, #58a6ff);
    text-decoration: none;
}

.exp-nvd-section a:hover {
    text-decoration: underline;
}

/* Endpoint & Detection details grids */
.exp-endpoint-details-grid,
.exp-detection-details-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 24px;
}


.exp-detail-subsection-title {
    font-size: 12px;
    font-weight: 600;
    color: var(--db-accent-blue, #58a6ff);
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.exp-detail-subsection-title::before {
    content: '●';
    font-size: 8px;
    color: var(--db-accent-blue, #58a6ff);
}

/* Action buttons */
.exp-detail-actions {
    margin-top: auto;
    padding-top: 20px;
    border-top: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
}

.exp-btn-dropdown {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, rgba(248, 81, 73, 0.1) 0%, rgba(248, 81, 73, 0.05) 100%);
    border: 1px solid rgba(248, 81, 73, 0.3);
    color: #f85149;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.exp-btn-dropdown:hover {
    background: linear-gradient(135deg, rgba(248, 81, 73, 0.2) 0%, rgba(248, 81, 73, 0.1) 100%);
    border-color: #f85149;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(248, 81, 73, 0.2);
}

.exp-btn-dropdown i:first-child {
    font-size: 14px;
}

/* Navigation for grouped view */
.exp-detail-navigation {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 16px 20px;
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    border-radius: 8px;
    margin-top: 16px;
}

.exp-nav-arrow {
    background: rgba(88, 166, 255, 0.1);
    border: 1px solid rgba(88, 166, 255, 0.25);
    color: var(--db-accent-blue, #58a6ff);
    width: 32px;
    height: 32px;
    border-radius: 6px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
}

.exp-nav-arrow:hover:not(:disabled) {
    background: rgba(88, 166, 255, 0.2);
    border-color: var(--db-accent-blue, #58a6ff);
}

.exp-nav-arrow:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.exp-nav-counter {
    font-size: 13px;
    color: var(--db-text-secondary, #8b949e);
}

.exp-nav-counter strong {
    color: var(--db-accent-blue, #58a6ff);
}

/* =============================================================================
   GROUPED CVE DRILLDOWN PANEL
   ============================================================================= */

#exposure-details-page .exp-drilldown-panel {
    background: var(--theme-bg-secondary, #191f28);
    border: 1px solid var(--theme-border-solid, rgba(48, 54, 61, 0.6));
    border-radius: 12px;
    overflow: hidden;
}

#exposure-details-page .exp-drilldown-loading,
#exposure-details-page .exp-drilldown-error {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 20px 24px;
    color: var(--theme-text-secondary, #8b949e);
}

#exposure-details-page .exp-drilldown-error {
    color: var(--theme-danger, #f85149);
    justify-content: space-between;
}

#exposure-details-page .exp-drilldown-layout {
    display: grid;
    grid-template-columns: minmax(320px, 380px) minmax(0, 1fr);
    min-height: 520px;
}

#exposure-details-page .exp-drilldown-left {
    padding: 20px;
    border-right: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
    background: var(--theme-bg-tertiary, #1e252e);
}

#exposure-details-page .exp-drilldown-right {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

#exposure-details-page .exp-drilldown-category {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 16px;
}

#exposure-details-page .exp-drilldown-category--os {
    background: var(--theme-info-bg, rgba(88, 166, 255, 0.15));
    color: var(--theme-info, #58a6ff);
    border: 1px solid var(--theme-info-glow, rgba(88, 166, 255, 0.35));
}

#exposure-details-page .exp-drilldown-category--ms-app {
    background: var(--theme-accent-purple-bg, rgba(163, 113, 247, 0.15));
    color: var(--theme-accent-purple, #a371f7);
    border: 1px solid var(--theme-accent-purple-glow, rgba(163, 113, 247, 0.35));
}

#exposure-details-page .exp-drilldown-category--app,
#exposure-details-page .exp-drilldown-category--multi,
#exposure-details-page .exp-drilldown-category--unknown {
    background: var(--theme-warning-bg, rgba(210, 153, 34, 0.15));
    color: var(--theme-warning, #d29922);
    border: 1px solid var(--theme-warning-glow, rgba(210, 153, 34, 0.35));
}

#exposure-details-page .exp-drilldown-section-title {
    font-size: 12px;
    font-weight: 700;
    color: var(--theme-text-primary, #e6edf3);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 10px;
}

#exposure-details-page .exp-drilldown-description {
    background: var(--theme-bg-secondary, #191f28);
    border: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
    border-radius: 10px;
    padding: 12px;
    color: var(--theme-text-secondary, #8b949e);
    max-height: 140px;
    overflow-y: auto;
    line-height: 1.5;
}

#exposure-details-page .exp-drilldown-meta-grid {
    margin-top: 14px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

#exposure-details-page .exp-drilldown-meta-item {
    background: var(--theme-bg-secondary, #191f28);
    border: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
    border-radius: 8px;
    padding: 10px;
}

#exposure-details-page .exp-drilldown-meta-label {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--theme-text-muted, #6e7681);
    margin-bottom: 6px;
}

#exposure-details-page .exp-drilldown-meta-value {
    font-size: 12px;
    color: var(--theme-text-primary, #e6edf3);
    word-break: break-word;
}

#exposure-details-page .exp-drilldown-kev-action-label {
    margin-top: 10px;
}

#exposure-details-page .exp-drilldown-fix-box {
    margin-top: 16px;
    padding: 14px;
    border-radius: 10px;
    background: var(--theme-bg-secondary, #191f28);
    border: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
}

#exposure-details-page .exp-drilldown-fix-text {
    font-size: 13px;
    color: var(--theme-text-secondary, #8b949e);
    margin-bottom: 10px;
    line-height: 1.6;
}

#exposure-details-page .exp-drilldown-fix-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#exposure-details-page .exp-drilldown-fix-list-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 8px;
    align-items: center;
    padding: 8px 10px;
    border-radius: 8px;
    background: var(--theme-bg-tertiary, #1e252e);
    border: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
}

#exposure-details-page .exp-drilldown-fix-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 20px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
}

#exposure-details-page .exp-drilldown-fix-badge--kb {
    background: var(--theme-info-bg, rgba(88, 166, 255, 0.15));
    color: var(--theme-info, #58a6ff);
}

#exposure-details-page .exp-drilldown-fix-badge--ver {
    background: var(--theme-accent-purple-bg, rgba(163, 113, 247, 0.15));
    color: var(--theme-accent-purple, #a371f7);
}

#exposure-details-page .exp-drilldown-fix-badge--na {
    background: var(--theme-bg-subtle-strong, rgba(255, 255, 255, 0.08));
    color: var(--theme-text-muted, #6e7681);
}

#exposure-details-page .exp-drilldown-fix-product {
    color: var(--theme-text-primary, #e6edf3);
    font-size: 12px;
}

#exposure-details-page .exp-drilldown-fix-target {
    color: var(--theme-text-secondary, #8b949e);
    font-size: 12px;
}

#exposure-details-page .exp-drilldown-fix-count {
    color: var(--theme-text-muted, #6e7681);
    font-size: 11px;
}

#exposure-details-page .exp-drilldown-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
    background: var(--theme-bg-tertiary, #1e252e);
}

#exposure-details-page .exp-drilldown-title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--theme-text-primary, #e6edf3);
    font-size: 14px;
    font-weight: 600;
}

#exposure-details-page .exp-drilldown-count-badge {
    background: var(--theme-danger-bg, rgba(248, 81, 73, 0.15));
    border: 1px solid var(--theme-danger-glow, rgba(248, 81, 73, 0.35));
    color: var(--theme-danger, #f85149);
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 999px;
}

#exposure-details-page .exp-drilldown-table-wrap {
    overflow-x: auto;
    flex: 1;
    position: relative;
}

#exposure-details-page .exp-drilldown-page-loading {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--theme-bg-overlay, rgba(0, 0, 0, 0.5));
    color: var(--theme-text-primary, #e6edf3);
    pointer-events: none;
}

#exposure-details-page .exp-drilldown-table-wrap--loading .exp-drilldown-table {
    opacity: 0.55;
}

#exposure-details-page .exp-drilldown-table {
    margin: 0;
    transition: opacity 0.15s ease;
}

#exposure-details-page .exp-drilldown-table tbody tr.exp-drilldown-row--resolved {
    opacity: 0.5;
}

#exposure-details-page .exp-drilldown-endpoint-cell {
    display: flex;
    align-items: center;
    gap: 8px;
}

#exposure-details-page .exp-drilldown-endpoint-cell a {
    color: var(--theme-text-link, #58a6ff);
    text-decoration: none;
    white-space: nowrap;
}

#exposure-details-page .exp-drilldown-endpoint-cell a:hover {
    text-decoration: underline;
}

#exposure-details-page .exp-drilldown-tooltip-trigger {
    border: none;
    outline: none;
    background: transparent;
    padding: 0;
    margin: 0;
    font: inherit;
    cursor: pointer;
}

#exposure-details-page .exp-drilldown-patch-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 108px;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.2px;
    text-transform: uppercase;
    border: 1px solid transparent;
    transition: transform 0.12s ease, filter 0.12s ease;
}

#exposure-details-page .exp-drilldown-patch-badge i {
    font-size: 12px;
}

#exposure-details-page .exp-drilldown-patch-badge:hover {
    transform: translateY(-1px);
    filter: brightness(1.08);
}

#exposure-details-page .exp-drilldown-patch-badge--patched {
    color: var(--theme-success, #3fb950);
    background: var(--theme-success-bg, rgba(63, 185, 80, 0.15));
    border-color: var(--theme-success-glow, rgba(63, 185, 80, 0.35));
}

#exposure-details-page .exp-drilldown-patch-badge--missing {
    color: var(--theme-danger, #f85149);
    background: var(--theme-danger-bg, rgba(248, 81, 73, 0.15));
    border-color: var(--theme-danger-glow, rgba(248, 81, 73, 0.35));
}

#exposure-details-page .exp-drilldown-patch-badge--pending-reboot {
    color: #f0883e;
    background: rgba(240, 136, 62, 0.15);
    border-color: rgba(240, 136, 62, 0.35);
}

#exposure-details-page .exp-drilldown-patch-badge--failed-install {
    color: #fb8500;
    background: rgba(251, 133, 0, 0.16);
    border-color: rgba(251, 133, 0, 0.36);
}

#exposure-details-page .exp-drilldown-patch-badge--unknown {
    color: var(--theme-text-secondary, #8b949e);
    background: var(--theme-bg-subtle, rgba(110, 118, 129, 0.16));
    border-color: var(--theme-border-subtle, rgba(48, 54, 61, 0.5));
}

/* --- Drilldown Detail Tooltip (shared) --- */
.hosts-tooltip.exp-drilldown-detail-tooltip {
    max-width: none !important;
    min-width: 720px;
    width: 900px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45), 0 2px 8px rgba(0, 0, 0, 0.25);
}

.exp-drilldown-detail-tooltip > .hosts-tooltip-content {
    max-height: 520px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--theme-border-subtle, rgba(48, 54, 61, 0.6)) transparent;
}

.exp-drilldown-detail-tooltip > .hosts-tooltip-content::-webkit-scrollbar {
    width: 6px;
}

.exp-drilldown-detail-tooltip > .hosts-tooltip-content::-webkit-scrollbar-track {
    background: transparent;
}

.exp-drilldown-detail-tooltip > .hosts-tooltip-content::-webkit-scrollbar-thumb {
    background: var(--theme-border-subtle, rgba(48, 54, 61, 0.6));
    border-radius: 3px;
}

.exp-drilldown-detail-tooltip .exp-drilldown-detail-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}

.exp-drilldown-detail-tooltip .exp-drilldown-detail-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.2px;
    border: 1px solid transparent;
}

.exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--patched {
    color: var(--theme-success, #3fb950);
    background: var(--theme-success-bg, rgba(63, 185, 80, 0.15));
    border-color: var(--theme-success-glow, rgba(63, 185, 80, 0.35));
}

.exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--missing {
    color: var(--theme-danger, #f85149);
    background: var(--theme-danger-bg, rgba(248, 81, 73, 0.15));
    border-color: var(--theme-danger-glow, rgba(248, 81, 73, 0.35));
}

.exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--pending-reboot {
    color: #f0883e;
    background: rgba(240, 136, 62, 0.14);
    border-color: rgba(240, 136, 62, 0.32);
}

.exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--failed-install {
    color: #fb8500;
    background: rgba(251, 133, 0, 0.16);
    border-color: rgba(251, 133, 0, 0.34);
}

.exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--unknown {
    color: var(--theme-text-secondary, #8b949e);
    background: var(--theme-bg-subtle, rgba(110, 118, 129, 0.16));
    border-color: var(--theme-border-subtle, rgba(48, 54, 61, 0.5));
}

.exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--neutral {
    color: var(--theme-text-primary, #e6edf3);
    background: var(--theme-bg-subtle, rgba(56, 139, 253, 0.12));
    border-color: var(--theme-info-glow, rgba(56, 139, 253, 0.35));
}

.exp-drilldown-detail-tooltip .exp-drilldown-detail-empty {
    margin-top: 10px;
    padding: 10px;
    border-radius: 8px;
    border: 1px dashed var(--theme-border-subtle, rgba(48, 54, 61, 0.45));
    color: var(--theme-text-secondary, #8b949e);
    font-size: 12px;
}

/* --- Context icon button in Why Vulnerable column --- */
#exposure-details-page .exp-drilldown-context-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    color: var(--theme-text-link, #58a6ff);
    background: var(--theme-bg-subtle, rgba(56, 139, 253, 0.10));
    transition: color 0.15s ease, background 0.15s ease, transform 0.15s ease;
    font-size: 13px;
}

#exposure-details-page .exp-drilldown-context-icon-btn:hover {
    color: var(--theme-text-primary, #e6edf3);
    background: var(--theme-bg-subtle, rgba(56, 139, 253, 0.28));
    transform: scale(1.1);
}

/* --- Context Tooltip: metadata rows --- */
.exp-drilldown-detail-tooltip .exp-tt-ctx-meta {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
    border-radius: 8px;
    overflow: hidden;
    background: var(--theme-bg-tertiary, #1e252e);
}

.exp-drilldown-detail-tooltip .exp-tt-ctx-meta-row {
    display: flex;
    align-items: center;
    padding: 7px 12px;
    border-bottom: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.25));
}

.exp-drilldown-detail-tooltip .exp-tt-ctx-meta-row:last-child {
    border-bottom: none;
}

.exp-drilldown-detail-tooltip .exp-tt-ctx-meta-label {
    flex: 0 0 160px;
    color: var(--theme-text-muted, #6e7681);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.exp-drilldown-detail-tooltip .exp-tt-ctx-meta-label i {
    width: 16px;
    text-align: center;
    margin-right: 6px;
    opacity: 0.7;
}

.exp-drilldown-detail-tooltip .exp-tt-ctx-meta-value {
    flex: 1;
    color: var(--theme-text-primary, #e6edf3);
    font-size: 12px;
    line-height: 1.35;
    word-break: break-word;
}

/* --- KB Section (shared between patch and context tooltips) --- */
.exp-drilldown-detail-tooltip .exp-tt-kb-section {
    margin-top: 10px;
    border: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
    border-radius: 8px;
    overflow: hidden;
    background: var(--theme-bg-tertiary, #1e252e);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--missing {
    border-color: rgba(248, 81, 73, 0.30);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--installed {
    border-color: rgba(63, 185, 80, 0.30);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--pending-reboot {
    border-color: rgba(240, 136, 62, 0.30);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--failed-install {
    border-color: rgba(251, 133, 0, 0.30);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--missing .exp-tt-kb-section-header {
    background: rgba(248, 81, 73, 0.10);
    border-bottom-color: rgba(248, 81, 73, 0.25);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--installed .exp-tt-kb-section-header {
    background: rgba(63, 185, 80, 0.10);
    border-bottom-color: rgba(63, 185, 80, 0.25);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--pending-reboot .exp-tt-kb-section-header {
    background: rgba(240, 136, 62, 0.12);
    border-bottom-color: rgba(240, 136, 62, 0.25);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--failed-install .exp-tt-kb-section-header {
    background: rgba(251, 133, 0, 0.12);
    border-bottom-color: rgba(251, 133, 0, 0.26);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--missing .exp-tt-kb-section-icon {
    color: var(--theme-danger, #f85149);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--installed .exp-tt-kb-section-icon {
    color: var(--theme-success, #3fb950);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--pending-reboot .exp-tt-kb-section-icon {
    color: #f0883e;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--failed-install .exp-tt-kb-section-icon {
    color: #fb8500;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section-icon {
    font-size: 13px;
    flex-shrink: 0;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    flex: 1;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--missing .exp-tt-kb-section-title {
    color: var(--theme-danger, #f85149);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--installed .exp-tt-kb-section-title {
    color: var(--theme-success, #3fb950);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--pending-reboot .exp-tt-kb-section-title {
    color: #f0883e;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--failed-install .exp-tt-kb-section-title {
    color: #fb8500;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section-count {
    font-size: 11px;
    font-weight: 700;
    color: var(--theme-text-primary, #e6edf3);
    background: var(--theme-bg-subtle, rgba(110, 118, 129, 0.16));
    padding: 1px 8px;
    border-radius: 999px;
    min-width: 22px;
    text-align: center;
}

/* --- KB Table wrapper with scroll --- */
.exp-drilldown-detail-tooltip .exp-tt-kb-table-wrap {
    max-height: 200px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--theme-border-subtle, rgba(48, 54, 61, 0.6)) transparent;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-table-wrap::-webkit-scrollbar {
    width: 6px;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-table-wrap::-webkit-scrollbar-track {
    background: transparent;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-table-wrap::-webkit-scrollbar-thumb {
    background: var(--theme-border-subtle, rgba(48, 54, 61, 0.6));
    border-radius: 3px;
}

/* --- KB Table --- */
.exp-drilldown-detail-tooltip .exp-tt-kb-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 11px;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 7px 10px;
    text-align: left;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    border-bottom: 2px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.5));
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--missing .exp-tt-kb-table thead th {
    color: var(--theme-danger, #f85149);
    background: var(--theme-bg-tertiary, #1e252e);
    border-bottom-color: rgba(248, 81, 73, 0.25);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--installed .exp-tt-kb-table thead th {
    color: var(--theme-success, #3fb950);
    background: var(--theme-bg-tertiary, #1e252e);
    border-bottom-color: rgba(63, 185, 80, 0.25);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--pending-reboot .exp-tt-kb-table thead th {
    color: #f0883e;
    background: var(--theme-bg-tertiary, #1e252e);
    border-bottom-color: rgba(240, 136, 62, 0.26);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--failed-install .exp-tt-kb-table thead th {
    color: #fb8500;
    background: var(--theme-bg-tertiary, #1e252e);
    border-bottom-color: rgba(251, 133, 0, 0.26);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-table tbody tr {
    transition: background 0.1s ease;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--missing .exp-tt-kb-table tbody tr:nth-child(even) {
    background: rgba(248, 81, 73, 0.03);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--missing .exp-tt-kb-table tbody tr:hover {
    background: rgba(248, 81, 73, 0.08);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--installed .exp-tt-kb-table tbody tr:nth-child(even) {
    background: rgba(63, 185, 80, 0.03);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--installed .exp-tt-kb-table tbody tr:hover {
    background: rgba(63, 185, 80, 0.08);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--pending-reboot .exp-tt-kb-table tbody tr:nth-child(even) {
    background: rgba(240, 136, 62, 0.04);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--pending-reboot .exp-tt-kb-table tbody tr:hover {
    background: rgba(240, 136, 62, 0.09);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--failed-install .exp-tt-kb-table tbody tr:nth-child(even) {
    background: rgba(251, 133, 0, 0.04);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--failed-install .exp-tt-kb-table tbody tr:hover {
    background: rgba(251, 133, 0, 0.09);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-table tbody td {
    padding: 6px 10px;
    border-bottom: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.18));
    vertical-align: top;
    line-height: 1.4;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-table tbody tr:last-child td {
    border-bottom: none;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-code {
    font-weight: 700;
    font-family: 'Monaco', 'Consolas', 'Courier New', monospace;
    font-size: 11px;
    white-space: nowrap;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--missing .exp-tt-kb-code {
    color: var(--theme-danger, #f85149);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--installed .exp-tt-kb-code {
    color: var(--theme-success, #3fb950);
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--pending-reboot .exp-tt-kb-code {
    color: #f0883e;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-section--failed-install .exp-tt-kb-code {
    color: #fb8500;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-desc {
    color: var(--theme-text-secondary, #8b949e);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-table tbody tr:hover .exp-tt-kb-desc {
    white-space: normal;
    word-break: break-word;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-date {
    color: var(--theme-text-muted, #6e7681);
    font-size: 10px;
    white-space: nowrap;
}

/* --- All-clear message for fully patched --- */
.exp-drilldown-detail-tooltip .exp-tt-kb-allclear {
    margin-top: 10px;
    padding: 10px 14px;
    border-radius: 8px;
    background: var(--theme-success-bg, rgba(63, 185, 80, 0.10));
    border: 1px solid var(--theme-success-glow, rgba(63, 185, 80, 0.30));
    color: var(--theme-success, #3fb950);
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.exp-drilldown-detail-tooltip .exp-tt-kb-allclear i {
    font-size: 16px;
    opacity: 0.85;
}

#exposure-details-page .exp-drilldown-why {
    display: flex;
    align-items: center;
    gap: 6px;
}

#exposure-details-page .exp-drilldown-why-icon {
    flex-shrink: 0;
    font-size: 14px;
}

#exposure-details-page .exp-drilldown-why-icon--active {
    color: var(--theme-danger, #f85149);
}

#exposure-details-page .exp-drilldown-why-icon--reopened {
    color: var(--theme-accent-orange, #f0883e);
}

#exposure-details-page .exp-drilldown-why-icon--patched {
    color: var(--theme-success, #3fb950);
}

#exposure-details-page .exp-drilldown-why-icon--uninstalled,
#exposure-details-page .exp-drilldown-why-icon--unknown {
    color: var(--theme-text-muted, #6e7681);
}

#exposure-details-page .exp-drilldown-why-text {
    color: var(--theme-text-secondary, #8b949e);
    font-size: 12px;
    line-height: 1.4;
}

#exposure-details-page .exp-drilldown-why-text--unknown {
    font-style: italic;
    color: var(--theme-text-muted, #6e7681);
}

#exposure-details-page .exp-drilldown-open--patched {
    color: var(--theme-success, #3fb950);
}

#exposure-details-page .exp-drilldown-open--stale {
    color: var(--theme-accent-orange, #f0883e);
}

#exposure-details-page .exp-drilldown-pagination {
    border-top: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
}

@media (max-width: 1200px) {
    #exposure-details-page .exp-drilldown-layout {
        grid-template-columns: minmax(300px, 340px) minmax(0, 1fr);
    }
}

@media (max-width: 960px) {
    #exposure-details-page .exp-drilldown-layout {
        grid-template-columns: 1fr;
    }

    #exposure-details-page .exp-drilldown-left {
        border-right: none;
        border-bottom: 1px solid var(--theme-border-subtle, rgba(48, 54, 61, 0.35));
    }
}

/* =============================================================================
   LOADING STATES
   ============================================================================= */

.exp-loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(13, 17, 23, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.exp-loading-spinner {
    font-size: 24px;
    color: var(--db-accent-blue, #58a6ff);
}

/* Stats loading placeholder */
.exp-filters-loading {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 250px;
    font-size: 16px;
    color: var(--db-text-secondary, #8b949e);
}

.exp-filters-loading i {
    margin-right: 10px;
}

/* Table horizontal scroll wrapper */
.exp-table-scroll-wrapper {
    overflow-x: auto;
}

.exp-table-scroll-wrapper::-webkit-scrollbar {
    height: 8px;
}

.exp-table-scroll-wrapper::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);
}

.exp-table-scroll-wrapper::-webkit-scrollbar-thumb {
    background: var(--db-border-subtle, rgba(255, 255, 255, 0.1));
    border-radius: 4px;
}

.exp-table-scroll-wrapper::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.2);
}

/* =============================================================================
   LIGHT THEME OVERRIDES
   Light theme specific styles for exposure module
   ============================================================================= */

/* Light Theme: Page Container */
[data-theme="light"] #exposure-summary-page,
[data-theme="light"] #exposure-details-page,
html[data-theme="light"] #exposure-summary-page,
html[data-theme="light"] #exposure-details-page {
    background-color: var(--theme-bg-primary) !important;
}

/* Light Theme: Navbar buttons */
[data-theme="light"] #exposure-summary-page .mybar .btn-bar,
[data-theme="light"] #exposure-details-page .mybar .btn-bar,
html[data-theme="light"] #exposure-summary-page .mybar .btn-bar,
html[data-theme="light"] #exposure-details-page .mybar .btn-bar {
    background: var(--theme-bg-secondary) !important;
    border: 1px solid var(--theme-border-color) !important;
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] #exposure-summary-page .mybar .btn-bar:hover,
[data-theme="light"] #exposure-details-page .mybar .btn-bar:hover,
html[data-theme="light"] #exposure-summary-page .mybar .btn-bar:hover,
html[data-theme="light"] #exposure-details-page .mybar .btn-bar:hover {
    background: var(--theme-table-row-hover) !important;
    border-color: var(--theme-accent-blue) !important;
    color: var(--theme-text-primary) !important;
}

[data-theme="light"] #exposure-summary-page .mybar .btn-bar.active,
[data-theme="light"] #exposure-details-page .mybar .btn-bar.active,
html[data-theme="light"] #exposure-summary-page .mybar .btn-bar.active,
html[data-theme="light"] #exposure-details-page .mybar .btn-bar.active {
    background: var(--theme-accent-blue-bg) !important;
    border: 1px solid var(--theme-accent-blue) !important;
    color: var(--theme-accent-blue) !important;
}

/* Light Theme: Stats Cards - Override dark gradient */
[data-theme="light"] .exp-stat-card,
html[data-theme="light"] .exp-stat-card {
    background: var(--theme-bg-secondary) !important;
    background-image: none !important;
    border: 1px solid var(--theme-border-solid) !important;
    box-shadow: var(--theme-shadow-sm) !important;
}

[data-theme="light"] .exp-stat-card:hover,
html[data-theme="light"] .exp-stat-card:hover {
    box-shadow: var(--theme-shadow-md) !important;
    border-color: var(--theme-border-accent) !important;
}

[data-theme="light"] .exp-stat-card .exp-stat-title,
html[data-theme="light"] .exp-stat-card .exp-stat-title {
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .exp-stat-card .exp-stat-value,
html[data-theme="light"] .exp-stat-card .exp-stat-value {
    color: var(--theme-text-primary) !important;
}

[data-theme="light"] .exp-stat-card .exp-stat-change,
html[data-theme="light"] .exp-stat-card .exp-stat-change {
    color: var(--theme-text-muted) !important;
}

/* Light Theme: Panels */
[data-theme="light"] .exp-panel,
html[data-theme="light"] .exp-panel {
    background: var(--theme-bg-card) !important;
    border: 1px solid var(--theme-border-color) !important;
    box-shadow: var(--theme-shadow-md) !important;
}

[data-theme="light"] .exp-panel-header,
html[data-theme="light"] .exp-panel-header {
    background: var(--theme-bg-tertiary) !important;
    border-bottom: 1px solid var(--theme-border-color) !important;
}

[data-theme="light"] .exp-panel-title,
html[data-theme="light"] .exp-panel-title {
    color: var(--theme-text-primary) !important;
}

[data-theme="light"] .exp-panel-subtitle,
html[data-theme="light"] .exp-panel-subtitle {
    color: var(--theme-text-secondary) !important;
}

/* Light Theme: Table */
[data-theme="light"] .exp-table,
html[data-theme="light"] .exp-table {
    background: var(--theme-bg-secondary) !important;
}

[data-theme="light"] .exp-table thead,
html[data-theme="light"] .exp-table thead {
    background: var(--theme-table-header-bg) !important;
}

[data-theme="light"] .exp-table thead th,
html[data-theme="light"] .exp-table thead th {
    color: var(--theme-text-dark) !important;
    /* gray-800 for visibility */
    background: var(--theme-table-header-bg) !important;
    border-bottom: 1px solid var(--theme-border-color) !important;
}

[data-theme="light"] .exp-table tbody tr,
html[data-theme="light"] .exp-table tbody tr {
    border-bottom: 1px solid var(--theme-border-subtle) !important;
}

[data-theme="light"] .exp-table tbody tr:hover,
html[data-theme="light"] .exp-table tbody tr:hover {
    background: var(--theme-table-row-hover) !important;
}

[data-theme="light"] .exp-table tbody td,
html[data-theme="light"] .exp-table tbody td {
    color: var(--theme-text-secondary) !important;
}

/* Light Theme: Charts */
[data-theme="light"] .exp-chart-container,
html[data-theme="light"] .exp-chart-container {
    background: var(--theme-bg-card) !important;
    border: 1px solid var(--theme-border-color) !important;
}

/* Light Theme: Filters */
[data-theme="light"] .exp-filter-dropdown,
html[data-theme="light"] .exp-filter-dropdown {
    background: var(--theme-bg-dropdown) !important;
    border: 1px solid var(--theme-border-color) !important;
    box-shadow: var(--theme-shadow-md) !important;
}

[data-theme="light"] .exp-filter-btn,
html[data-theme="light"] .exp-filter-btn {
    background: var(--theme-bg-secondary) !important;
    border: 1px solid var(--theme-border-color) !important;
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .exp-filter-btn:hover,
html[data-theme="light"] .exp-filter-btn:hover {
    background: var(--theme-bg-card-hover) !important;
    border-color: var(--theme-border-accent) !important;
}

/* Light Theme: Badges */
[data-theme="light"] .exp-badge,
html[data-theme="light"] .exp-badge {
    background: var(--theme-bg-tertiary) !important;
    border: 1px solid var(--theme-border-color) !important;
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .exp-badge.exp-badge-critical,
html[data-theme="light"] .exp-badge.exp-badge-critical {
    background: var(--theme-danger-bg) !important;
    border-color: var(--theme-danger-light) !important;
    color: var(--theme-danger-dark) !important;
}

[data-theme="light"] .exp-badge.exp-badge-high,
html[data-theme="light"] .exp-badge.exp-badge-high {
    background: var(--theme-warning-bg) !important;
    border-color: var(--theme-warning-light) !important;
    color: var(--theme-warning-dark) !important;
}

[data-theme="light"] .exp-badge.exp-badge-medium,
html[data-theme="light"] .exp-badge.exp-badge-medium {
    background: var(--theme-info-bg) !important;
    border-color: var(--theme-info-glow) !important;
    color: var(--theme-accent-cyan) !important;
}

[data-theme="light"] .exp-badge.exp-badge-low,
html[data-theme="light"] .exp-badge.exp-badge-low {
    background: var(--theme-success-bg) !important;
    border-color: var(--theme-success-light) !important;
    color: var(--theme-success-dark) !important;
}

/* Light Theme: Detail sections */
[data-theme="light"] .exp-detail-left,
html[data-theme="light"] .exp-detail-left {
    border-right-color: var(--theme-border-color) !important;
}

[data-theme="light"] .exp-detail-section-title,
html[data-theme="light"] .exp-detail-section-title {
    color: var(--theme-text-primary) !important;
    border-bottom-color: var(--theme-border-color) !important;
}

[data-theme="light"] .exp-detail-description,
html[data-theme="light"] .exp-detail-description {
    background: var(--theme-accent-blue-bg-subtle) !important;
    border: 1px solid var(--theme-border-accent) !important;
    color: var(--theme-text-secondary) !important;
}

/* Light Theme: General Cards - Override dark gradient */
[data-theme="light"] .exp-card,
html[data-theme="light"] .exp-card {
    background: var(--theme-bg-secondary) !important;
    background-image: none !important;
    border: 1px solid var(--theme-border-solid) !important;
    box-shadow: var(--theme-shadow-sm) !important;
}

[data-theme="light"] .exp-card-header,
html[data-theme="light"] .exp-card-header {
    background: var(--theme-bg-secondary) !important;
    border-bottom: 1px solid var(--theme-border-solid) !important;
}

[data-theme="light"] .exp-card-title,
html[data-theme="light"] .exp-card-title {
    color: var(--theme-text-primary) !important;
}

[data-theme="light"] .exp-card-title i,
html[data-theme="light"] .exp-card-title i {
    color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-card-body,
html[data-theme="light"] .exp-card-body {
    background: var(--theme-bg-secondary) !important;
}

[data-theme="light"] .exp-card-action,
[data-theme="light"] .exp-card-actions .btn,
html[data-theme="light"] .exp-card-action,
html[data-theme="light"] .exp-card-actions .btn {
    background: var(--theme-bg-primary) !important;
    border: 1px solid var(--theme-border-solid) !important;
    color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-card-action:hover,
[data-theme="light"] .exp-card-actions .btn:hover,
html[data-theme="light"] .exp-card-action:hover,
html[data-theme="light"] .exp-card-actions .btn:hover {
    background: var(--theme-accent-blue-bg) !important;
    border-color: var(--theme-accent-blue) !important;
}

/* Light Theme: Endpoint Health Card - Override dark gradient */
[data-theme="light"] .exp-endpoint-health-card,
html[data-theme="light"] .exp-endpoint-health-card {
    background: var(--theme-bg-secondary) !important;
    background-image: none !important;
    border: 1px solid var(--theme-border-solid) !important;
    box-shadow: var(--theme-shadow-sm) !important;
}

[data-theme="light"] .exp-endpoint-health-header,
html[data-theme="light"] .exp-endpoint-health-header {
    background: transparent !important;
}

[data-theme="light"] .exp-endpoint-health-total,
html[data-theme="light"] .exp-endpoint-health-total {
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .exp-endpoint-health-total span,
html[data-theme="light"] .exp-endpoint-health-total span {
    color: var(--theme-text-primary) !important;
}

[data-theme="light"] .exp-endpoint-stat,
html[data-theme="light"] .exp-endpoint-stat {
    background: var(--theme-bg-tertiary) !important;
    border: 1px solid var(--theme-border-solid) !important;
}

[data-theme="light"] .exp-endpoint-stat:hover,
html[data-theme="light"] .exp-endpoint-stat:hover {
    background: var(--theme-bg-primary) !important;
    border-color: var(--theme-border-muted) !important;
}

[data-theme="light"] .exp-endpoint-health-title,
html[data-theme="light"] .exp-endpoint-health-title {
    color: var(--theme-text-primary) !important;
}

[data-theme="light"] .exp-endpoint-health-subtitle,
html[data-theme="light"] .exp-endpoint-health-subtitle {
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .exp-endpoint-health-stat-value,
html[data-theme="light"] .exp-endpoint-health-stat-value {
    color: var(--theme-text-primary) !important;
}

[data-theme="light"] .exp-endpoint-health-stat-label,
html[data-theme="light"] .exp-endpoint-health-stat-label {
    color: var(--theme-text-secondary) !important;
}

/* Light Theme: Loading overlay */
[data-theme="light"] .exp-loading-overlay,
html[data-theme="light"] .exp-loading-overlay {
    background: var(--theme-bg-glass) !important;
}

/* Light Theme: Table Pagination Footer */
[data-theme="light"] .exp-table-pagination,
html[data-theme="light"] .exp-table-pagination {
    background: var(--theme-bg-tertiary) !important;
    border-top: 1px solid var(--theme-border-solid) !important;
}

[data-theme="light"] .exp-pagination-info,
html[data-theme="light"] .exp-pagination-info {
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .exp-pagination-btn,
html[data-theme="light"] .exp-pagination-btn {
    background: var(--theme-bg-secondary) !important;
    border: 1px solid var(--theme-border-solid) !important;
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .exp-pagination-btn:hover:not(:disabled),
html[data-theme="light"] .exp-pagination-btn:hover:not(:disabled) {
    background: var(--theme-table-row-hover) !important;
    border-color: var(--theme-accent-blue) !important;
    color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-pagination-btn:disabled,
html[data-theme="light"] .exp-pagination-btn:disabled {
    background: var(--theme-bg-primary) !important;
    color: var(--theme-text-muted-decorative) !important;
}

/* Light Theme: Scrollbar */
[data-theme="light"] .exp-table-scroll-wrapper::-webkit-scrollbar-track,
html[data-theme="light"] .exp-table-scroll-wrapper::-webkit-scrollbar-track {
    background: var(--theme-scrollbar-track) !important;
}

[data-theme="light"] .exp-table-scroll-wrapper::-webkit-scrollbar-thumb,
html[data-theme="light"] .exp-table-scroll-wrapper::-webkit-scrollbar-thumb {
    background: var(--theme-scrollbar-thumb) !important;
}

[data-theme="light"] .exp-table-scroll-wrapper::-webkit-scrollbar-thumb:hover,
html[data-theme="light"] .exp-table-scroll-wrapper::-webkit-scrollbar-thumb:hover {
    background: var(--theme-scrollbar-thumb-hover) !important;
}

/* =============================================================================
   LIGHT THEME - Exposure Details Page
   ============================================================================= */

/* Filters Container (the status grid) */
[data-theme="light"] .exp-filters-container,
html[data-theme="light"] .exp-filters-container {
    background: var(--theme-bg-secondary) !important;
    background-image: none !important;
    border: 1px solid var(--theme-border-solid) !important;
    box-shadow: var(--theme-shadow-sm) !important;
}

/* Filter Column */
[data-theme="light"] .exp-filter-column,
html[data-theme="light"] .exp-filter-column {
    border-color: var(--theme-border-solid) !important;
}

/* Filter Column Headers */
[data-theme="light"] .exp-filter-column-header,
html[data-theme="light"] .exp-filter-column-header {
    background: var(--theme-bg-tertiary) !important;
    color: var(--theme-text-dark) !important;
    border-bottom: 1px solid var(--theme-border-solid) !important;
}

[data-theme="light"] .exp-filter-column-title,
html[data-theme="light"] .exp-filter-column-title {
    color: var(--theme-text-dark) !important;
}

/* Filter Column Items */
[data-theme="light"] .exp-filter-item,
html[data-theme="light"] .exp-filter-item {
    color: var(--theme-text-tertiary) !important;
    border-bottom-color: var(--theme-border-subtle) !important;
}

[data-theme="light"] .exp-filter-item:hover,
html[data-theme="light"] .exp-filter-item:hover {
    background: var(--theme-table-row-hover) !important;
}

[data-theme="light"] .exp-filter-item.active,
html[data-theme="light"] .exp-filter-item.active {
    background: var(--theme-accent-blue-bg) !important;
}

[data-theme="light"] .exp-filter-item-name,
html[data-theme="light"] .exp-filter-item-name {
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .exp-filter-item-count,
html[data-theme="light"] .exp-filter-item-count {
    background: var(--theme-bg-primary) !important;
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .exp-filter-count,
html[data-theme="light"] .exp-filter-count {
    background: var(--theme-bg-primary) !important;
    color: var(--theme-text-secondary) !important;
}

/* Search dropdown in filters */
[data-theme="light"] .searchOnCve,
html[data-theme="light"] .searchOnCve {
    background: var(--theme-bg-secondary) !important;
    border: 1px solid var(--theme-border-solid) !important;
    box-shadow: var(--theme-shadow-md) !important;
}

[data-theme="light"] .searchOnCve li,
html[data-theme="light"] .searchOnCve li {
    background: var(--theme-bg-secondary) !important;
}

[data-theme="light"] .searchOnCve li a,
html[data-theme="light"] .searchOnCve li a {
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .searchOnCve li:hover,
html[data-theme="light"] .searchOnCve li:hover {
    background: var(--theme-table-row-hover) !important;
}

/* Data Table Container */
[data-theme="light"] .exp-data-table-container,
html[data-theme="light"] .exp-data-table-container {
    background: var(--theme-bg-secondary) !important;
    background-image: none !important;
    border: 1px solid var(--theme-border-solid) !important;
    box-shadow: var(--theme-shadow-sm) !important;
}

/* Data Table Headers */
[data-theme="light"] .exp-data-table thead th,
html[data-theme="light"] .exp-data-table thead th {
    background: var(--theme-bg-tertiary) !important;
    color: var(--theme-text-dark) !important;
    border-bottom: 1px solid var(--theme-border-solid) !important;
}

/* Data Table Body */
[data-theme="light"] .exp-data-table tbody tr,
html[data-theme="light"] .exp-data-table tbody tr {
    background: var(--theme-bg-secondary) !important;
}

[data-theme="light"] .exp-data-table tbody tr:hover,
html[data-theme="light"] .exp-data-table tbody tr:hover {
    background: var(--theme-table-row-hover) !important;
}

[data-theme="light"] .exp-data-table tbody tr.expanded,
html[data-theme="light"] .exp-data-table tbody tr.expanded {
    background: var(--theme-table-row-hover) !important;
}

[data-theme="light"] .exp-data-table tbody td,
html[data-theme="light"] .exp-data-table tbody td {
    color: var(--theme-text-tertiary) !important;
    border-bottom-color: var(--theme-border-solid) !important;
}

/* Standard Table Headers */
[data-theme="light"] .exp-table thead th,
html[data-theme="light"] .exp-table thead th {
    background: var(--theme-bg-tertiary) !important;
    color: var(--theme-text-dark) !important;
    border-bottom: 1px solid var(--theme-border-solid) !important;
}

/* CVE Links */
[data-theme="light"] .exp-data-table .cve-link,
html[data-theme="light"] .exp-data-table .cve-link {
    color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-data-table .cve-link:hover,
html[data-theme="light"] .exp-data-table .cve-link:hover {
    color: var(--theme-accent-blue-dark) !important;
}

/* Copy button light theme */
[data-theme="light"] .exp-copy-btn,
html[data-theme="light"] .exp-copy-btn {
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .exp-copy-btn:hover,
html[data-theme="light"] .exp-copy-btn:hover {
    color: var(--theme-accent-blue) !important;
    background: rgba(56, 139, 253, 0.08) !important;
}

[data-theme="light"] .exp-copy-btn--copied,
html[data-theme="light"] .exp-copy-btn--copied,
[data-theme="light"] .exp-copy-btn--copied:hover,
html[data-theme="light"] .exp-copy-btn--copied:hover {
    color: var(--theme-success, #1a7f37) !important;
    background: rgba(26, 127, 55, 0.08) !important;
}

/* Dropdown Button (All CVEs) */
[data-theme="light"] .exp-btn-dropdown,
html[data-theme="light"] .exp-btn-dropdown {
    background: var(--theme-bg-secondary) !important;
    background-image: none !important;
    border: 1px solid var(--theme-border-solid) !important;
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .exp-btn-dropdown:hover,
html[data-theme="light"] .exp-btn-dropdown:hover {
    background: var(--theme-bg-tertiary) !important;
    border-color: var(--theme-accent-blue) !important;
    color: var(--theme-accent-blue) !important;
    box-shadow: 0 2px 8px var(--theme-accent-blue-glow) !important;
}

/* Dropdown Menu */
[data-theme="light"] .exp-dropdown-menu,
html[data-theme="light"] .exp-dropdown-menu {
    background: var(--theme-bg-secondary) !important;
    border: 1px solid var(--theme-border-solid) !important;
    box-shadow: var(--theme-shadow-md) !important;
}

[data-theme="light"] .exp-dropdown-item,
html[data-theme="light"] .exp-dropdown-item {
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .exp-dropdown-item:hover,
html[data-theme="light"] .exp-dropdown-item:hover {
    background: var(--theme-table-row-hover) !important;
    color: var(--theme-accent-blue) !important;
}

/* Expand Button - Red to match alerts/threats */
[data-theme="light"] .exp-expand-btn,
html[data-theme="light"] .exp-expand-btn {
    --exp-expand-btn-bg: var(--theme-danger-bg);
    --exp-expand-btn-border: var(--theme-danger-glow);
    --exp-expand-btn-color: var(--theme-danger);
    background: var(--theme-danger-bg) !important;
    border: 1px solid var(--theme-danger-glow) !important;
    color: var(--theme-danger) !important;
}

[data-theme="light"] .exp-expand-btn:hover,
html[data-theme="light"] .exp-expand-btn:hover {
    background: var(--theme-danger-glow) !important;
    border-color: var(--theme-danger) !important;
    color: var(--theme-danger-dark) !important;
}

[data-theme="light"] .exp-expand-btn i,
html[data-theme="light"] .exp-expand-btn i {
    color: var(--theme-danger) !important;
}

/* Description text - darker for readability */
[data-theme="light"] .exp-description-text,
html[data-theme="light"] .exp-description-text {
    color: var(--theme-text-dark) !important;
}

[data-theme="light"] .exp-detail-description,
html[data-theme="light"] .exp-detail-description {
    color: var(--theme-text-tertiary) !important;
}

/* All table cell text darker */
[data-theme="light"] .exp-data-table tbody td,
html[data-theme="light"] .exp-data-table tbody td {
    color: var(--theme-text-dark) !important;
}

/* Endpoint name and other text */
[data-theme="light"] .exp-endpoint-name,
html[data-theme="light"] .exp-endpoint-name {
    color: var(--theme-text-dark) !important;
}

/* Expanded Row Details */
[data-theme="light"] .exp-detail-row,
html[data-theme="light"] .exp-detail-row {
    background: var(--theme-bg-tertiary) !important;
}

[data-theme="light"] .exp-detail-panel,
html[data-theme="light"] .exp-detail-panel {
    background: var(--theme-bg-primary) !important;
}

[data-theme="light"] .exp-detail-panel-inner,
html[data-theme="light"] .exp-detail-panel-inner {
    background: var(--theme-bg-secondary) !important;
    background-image: none !important;
    border: 1px solid var(--theme-border-solid) !important;
    box-shadow: var(--theme-shadow-sm) !important;
}

[data-theme="light"] .exp-detail-left,
html[data-theme="light"] .exp-detail-left {
    border-right-color: var(--theme-border-solid) !important;
}

[data-theme="light"] .exp-detail-right,
html[data-theme="light"] .exp-detail-right {
    background: var(--theme-bg-tertiary) !important;
}

[data-theme="light"] .exp-detail-title,
html[data-theme="light"] .exp-detail-title {
    color: var(--theme-text-dark) !important;
}

[data-theme="light"] .exp-detail-label,
html[data-theme="light"] .exp-detail-label {
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .exp-detail-value,
html[data-theme="light"] .exp-detail-value {
    color: var(--theme-text-tertiary) !important;
}

/* Detail Info Items (the cards with labels) */
[data-theme="light"] .exp-detail-info-item,
html[data-theme="light"] .exp-detail-info-item {
    background: var(--theme-bg-tertiary) !important;
    background-image: none !important;
    border: 1px solid var(--theme-border-solid) !important;
    border-left: 3px solid var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-detail-info-item:hover,
html[data-theme="light"] .exp-detail-info-item:hover {
    background: var(--theme-bg-primary) !important;
    border-left-color: var(--theme-accent-blue-dark) !important;
}

[data-theme="light"] .exp-detail-info-label,
html[data-theme="light"] .exp-detail-info-label {
    color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-detail-info-value,
html[data-theme="light"] .exp-detail-info-value {
    color: var(--theme-text-dark) !important;
}

/* Remediation Panel */
[data-theme="light"] .exp-remediation-panel,
html[data-theme="light"] .exp-remediation-panel {
    background: var(--theme-table-row-hover) !important;
    border: 1px solid var(--theme-border-accent) !important;
}

[data-theme="light"] .exp-remediation-header,
html[data-theme="light"] .exp-remediation-header {
    color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-remediation-text,
html[data-theme="light"] .exp-remediation-text {
    color: var(--theme-text-tertiary) !important;
}

/* NVD Link section */
[data-theme="light"] .exp-nvd-section,
html[data-theme="light"] .exp-nvd-section {
    color: var(--theme-text-secondary) !important;
}

/* Sidebar sections (Endpoint Details, Detection Details) */
[data-theme="light"] .exp-detail-sidebar-section,
html[data-theme="light"] .exp-detail-sidebar-section {
    background: var(--theme-bg-secondary) !important;
    border: 1px solid var(--theme-border-solid) !important;
}

[data-theme="light"] .exp-detail-sidebar-title,
html[data-theme="light"] .exp-detail-sidebar-title {
    color: var(--theme-text-dark) !important;
    border-bottom-color: var(--theme-border-solid) !important;
}

[data-theme="light"] .exp-detail-sidebar-item,
html[data-theme="light"] .exp-detail-sidebar-item {
    border-bottom-color: var(--theme-border-subtle) !important;
}

[data-theme="light"] .exp-detail-sidebar-label,
html[data-theme="light"] .exp-detail-sidebar-label {
    color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-detail-sidebar-value,
html[data-theme="light"] .exp-detail-sidebar-value {
    color: var(--theme-text-dark) !important;
}

/* Actions section (Ignore Detection button) */
[data-theme="light"] .exp-detail-actions,
html[data-theme="light"] .exp-detail-actions {
    border-top-color: var(--theme-border-solid) !important;
}

/* Subsection titles (Endpoint Details, Detection Details) */
[data-theme="light"] .exp-detail-subsection-title,
html[data-theme="light"] .exp-detail-subsection-title {
    color: var(--theme-danger-dark) !important;
    /* Red accent like alerts */
    border-bottom-color: var(--theme-danger-light) !important;
}

/* Endpoint and Detection Details Grids */
[data-theme="light"] .exp-endpoint-details-grid .exp-detail-info-item,
[data-theme="light"] .exp-detection-details-grid .exp-detail-info-item,
html[data-theme="light"] .exp-endpoint-details-grid .exp-detail-info-item,
html[data-theme="light"] .exp-detection-details-grid .exp-detail-info-item {
    background: var(--theme-bg-secondary) !important;
    border: 1px solid var(--theme-border-solid) !important;
    border-left: 3px solid var(--theme-accent-blue) !important;
}

/* Description box */
[data-theme="light"] .exp-detail-description,
html[data-theme="light"] .exp-detail-description {
    background: var(--theme-bg-tertiary) !important;
    border: 1px solid var(--theme-border-solid) !important;
    color: var(--theme-text-tertiary) !important;
}

/* KEV Warning Panel */
[data-theme="light"] .exp-kev-warning-panel,
html[data-theme="light"] .exp-kev-warning-panel {
    background: var(--theme-danger-bg) !important;
    border: 1px solid var(--theme-danger-glow) !important;
}

[data-theme="light"] .exp-kev-warning-header,
html[data-theme="light"] .exp-kev-warning-header {
    color: var(--theme-danger-dark) !important;
}

/* Vulnerability Navigation Bar (Showing 1/2 Vulnerabilities) */
[data-theme="light"] .exp-detail-navigation,
html[data-theme="light"] .exp-detail-navigation {
    background: var(--theme-bg-tertiary) !important;
    border: 1px solid var(--theme-border-solid) !important;
}

[data-theme="light"] .exp-nav-counter,
html[data-theme="light"] .exp-nav-counter {
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .exp-nav-counter strong,
html[data-theme="light"] .exp-nav-counter strong {
    color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-nav-arrow,
html[data-theme="light"] .exp-nav-arrow {
    background: var(--theme-bg-secondary) !important;
    border: 1px solid var(--theme-border-solid) !important;
    color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-nav-arrow:hover:not(:disabled),
html[data-theme="light"] .exp-nav-arrow:hover:not(:disabled) {
    background: var(--theme-accent-blue-bg) !important;
    border-color: var(--theme-accent-blue) !important;
}

/* Date Picker Button */
[data-theme="light"] .exp-date-picker-btn,
html[data-theme="light"] .exp-date-picker-btn {
    background: var(--theme-bg-secondary) !important;
    background-image: none !important;
    border: 1px solid var(--theme-border-solid) !important;
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .exp-date-picker-btn:hover,
html[data-theme="light"] .exp-date-picker-btn:hover {
    background: var(--theme-bg-tertiary) !important;
    border-color: var(--theme-accent-blue) !important;
    color: var(--theme-accent-blue) !important;
}

/* Toggle Options (Group by CVE, Show KEV) */
[data-theme="light"] .exp-toggle-option,
html[data-theme="light"] .exp-toggle-option {
    background: var(--theme-bg-secondary) !important;
    border: 1px solid var(--theme-border-solid) !important;
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .exp-toggle-option:hover,
html[data-theme="light"] .exp-toggle-option:hover {
    border-color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-toggle-option.active,
html[data-theme="light"] .exp-toggle-option.active {
    background: var(--theme-table-row-hover) !important;
    border-color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .exp-toggle-option label,
html[data-theme="light"] .exp-toggle-option label {
    color: var(--theme-text-tertiary) !important;
}

/* Hosts Tooltip (Vulnerable Hosts popup) - Base Styles */
.hosts-tooltip {
    background: var(--hosts-tooltip-bg, #1b1f23);
    border: 1px solid var(--hosts-tooltip-border, #3a3f46);
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    min-width: 280px;
    max-width: 400px;
    z-index: 1000;
}

.hosts-tooltip-arrow-outer {
    position: absolute;
    top: -7px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid var(--hosts-tooltip-border, #3a3f46);
}

.hosts-tooltip-arrow-inner {
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid var(--hosts-tooltip-bg, #1b1f23);
}

.hosts-tooltip-header {
    background-color: var(--hosts-tooltip-header-bg, #1b1f23);
    border-bottom: 1px solid var(--hosts-tooltip-border, #3a3f46);
    padding: 12px 15px;
    position: relative;
    border-radius: 8px 8px 0 0;
}

.hosts-tooltip-title {
    margin: 0;
    color: var(--hosts-tooltip-title-color, #e0e0e0);
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    padding-right: 30px;
}

.hosts-tooltip-title i {
    margin-right: 8px;
    color: var(--hosts-tooltip-icon-color, #6c757d);
}

.hosts-tooltip-cve-id {
    color: var(--hosts-tooltip-accent, #58a6ff);
    margin-left: 4px;
}

.hosts-tooltip-close {
    position: absolute;
    top: 8px;
    right: 8px;
    background: transparent;
    border: none;
    color: var(--hosts-tooltip-close-color, #9e9e9e);
    font-size: 14px;
    cursor: pointer;
    padding: 4px 6px;
    line-height: 1;
    transition: all 0.2s;
    border-radius: 4px;
}

.hosts-tooltip-close:hover {
    color: #ff5252;
    background-color: rgba(255, 82, 82, 0.1);
}

.hosts-tooltip-content {
    padding: 15px;
    background: var(--hosts-tooltip-bg, #1b1f23);
}

.hosts-tooltip-footer {
    background-color: var(--hosts-tooltip-footer-bg, #1b1f23);
    border-top: 1px solid var(--hosts-tooltip-border, #3a3f46);
    padding: 10px 15px;
    font-size: 11px;
    color: var(--hosts-tooltip-footer-color, #9e9e9e);
    border-radius: 0 0 8px 8px;
}

.hosts-tooltip-footer-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hosts-tooltip-footer-stat {
    display: flex;
    align-items: center;
}

.hosts-tooltip-vulnerable-dot {
    width: 8px;
    height: 8px;
    background-color: #ff5252;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
}

/* Light Theme: Hosts Tooltip */
[data-theme="light"] .hosts-tooltip,
html[data-theme="light"] .hosts-tooltip {
    --hosts-tooltip-bg: var(--theme-bg-secondary);
    --hosts-tooltip-border: var(--theme-border-solid);
    --hosts-tooltip-header-bg: var(--theme-bg-tertiary);
    --hosts-tooltip-title-color: var(--theme-text-dark);
    --hosts-tooltip-icon-color: var(--theme-text-secondary);
    --hosts-tooltip-accent: var(--theme-accent-blue);
    --hosts-tooltip-close-color: var(--theme-text-secondary);
    background: var(--theme-bg-secondary) !important;
    border: 1px solid var(--theme-border-solid) !important;
    box-shadow: var(--theme-shadow-lg) !important;
}

[data-theme="light"] .hosts-tooltip-arrow-outer,
html[data-theme="light"] .hosts-tooltip-arrow-outer {
    border-bottom-color: var(--theme-border-solid) !important;
}

[data-theme="light"] .hosts-tooltip-arrow-inner,
html[data-theme="light"] .hosts-tooltip-arrow-inner {
    border-bottom-color: var(--theme-bg-tertiary) !important;
}

[data-theme="light"] .hosts-tooltip-header,
html[data-theme="light"] .hosts-tooltip-header {
    background-color: var(--theme-bg-tertiary) !important;
    border-bottom-color: var(--theme-border-solid) !important;
}

[data-theme="light"] .hosts-tooltip-title,
html[data-theme="light"] .hosts-tooltip-title {
    color: var(--theme-text-dark) !important;
}

[data-theme="light"] .hosts-tooltip-title i,
html[data-theme="light"] .hosts-tooltip-title i {
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .hosts-tooltip-cve-id,
html[data-theme="light"] .hosts-tooltip-cve-id {
    color: var(--theme-accent-blue) !important;
}

[data-theme="light"] .hosts-tooltip-close,
html[data-theme="light"] .hosts-tooltip-close {
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .hosts-tooltip-content,
html[data-theme="light"] .hosts-tooltip-content {
    background: var(--theme-bg-secondary) !important;
}

[data-theme="light"] .hosts-tooltip-footer,
html[data-theme="light"] .hosts-tooltip-footer {
    background-color: var(--theme-bg-tertiary) !important;
    border-top-color: var(--theme-border-solid) !important;
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .hosts-tooltip-footer span,
html[data-theme="light"] .hosts-tooltip-footer span {
    color: var(--theme-text-secondary) !important;
}

/* Light Theme: Tooltip Header (legacy support) */
[data-theme="light"] .hosts-tooltip h5,
html[data-theme="light"] .hosts-tooltip h5 {
    color: var(--theme-text-dark) !important;
}

[data-theme="light"] .hosts-tooltip h6,
html[data-theme="light"] .hosts-tooltip h6 {
    color: var(--theme-text-tertiary) !important;
}

/* Light Theme: Tooltip text */
[data-theme="light"] .hosts-tooltip span,
html[data-theme="light"] .hosts-tooltip span {
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .hosts-tooltip p,
html[data-theme="light"] .hosts-tooltip p {
    color: var(--theme-text-secondary) !important;
}

/* Light Theme: Server/Desktop icons */
[data-theme="light"] .hosts-tooltip .fa-server,
[data-theme="light"] .hosts-tooltip .fa-desktop,
html[data-theme="light"] .hosts-tooltip .fa-server,
html[data-theme="light"] .hosts-tooltip .fa-desktop {
    color: var(--theme-text-secondary) !important;
}

/* Keep red/green accent colors for vulnerable/patched hosts */
[data-theme="light"] .hosts-tooltip span[style*="color: #ff5252"],
html[data-theme="light"] .hosts-tooltip span[style*="color: #ff5252"] {
    color: var(--theme-danger-dark) !important;
}

[data-theme="light"] .hosts-tooltip span[style*="color: #4caf50"],
html[data-theme="light"] .hosts-tooltip span[style*="color: #4caf50"] {
    color: var(--theme-success-dark) !important;
}

/* Light Theme: Drilldown Detail Tooltip overrides */
[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-code,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-code {
    color: var(--theme-text-dark) !important;
}

[data-theme="light"] .exp-tt-kb-section--missing .exp-tt-kb-code,
html[data-theme="light"] .exp-tt-kb-section--missing .exp-tt-kb-code {
    color: var(--theme-danger, #cf222e) !important;
}

[data-theme="light"] .exp-tt-kb-section--installed .exp-tt-kb-code,
html[data-theme="light"] .exp-tt-kb-section--installed .exp-tt-kb-code {
    color: var(--theme-success, #1a7f37) !important;
}

[data-theme="light"] .exp-tt-kb-section--pending-reboot .exp-tt-kb-code,
html[data-theme="light"] .exp-tt-kb-section--pending-reboot .exp-tt-kb-code {
    color: #9a6700 !important;
}

[data-theme="light"] .exp-tt-kb-section--failed-install .exp-tt-kb-code,
html[data-theme="light"] .exp-tt-kb-section--failed-install .exp-tt-kb-code {
    color: #bc4c00 !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-desc,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-desc {
    color: var(--theme-text-secondary) !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-date,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-date {
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-ctx-meta-value,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-ctx-meta-value {
    color: var(--theme-text-dark) !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-ctx-meta-label,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-ctx-meta-label {
    color: var(--theme-text-tertiary) !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-section-title,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-section-title {
    /* Let section-specific colors apply */
}

[data-theme="light"] .exp-tt-kb-section--missing .exp-tt-kb-section-header,
html[data-theme="light"] .exp-tt-kb-section--missing .exp-tt-kb-section-header {
    background: rgba(207, 34, 46, 0.08) !important;
}

[data-theme="light"] .exp-tt-kb-section--installed .exp-tt-kb-section-header,
html[data-theme="light"] .exp-tt-kb-section--installed .exp-tt-kb-section-header {
    background: rgba(26, 127, 55, 0.08) !important;
}

[data-theme="light"] .exp-tt-kb-section--pending-reboot .exp-tt-kb-section-header,
html[data-theme="light"] .exp-tt-kb-section--pending-reboot .exp-tt-kb-section-header {
    background: rgba(154, 103, 0, 0.10) !important;
}

[data-theme="light"] .exp-tt-kb-section--failed-install .exp-tt-kb-section-header,
html[data-theme="light"] .exp-tt-kb-section--failed-install .exp-tt-kb-section-header {
    background: rgba(188, 76, 0, 0.10) !important;
}

[data-theme="light"] .exp-tt-kb-section--missing .exp-tt-kb-table thead th,
html[data-theme="light"] .exp-tt-kb-section--missing .exp-tt-kb-table thead th {
    color: var(--theme-danger, #cf222e) !important;
    background: var(--theme-bg-secondary, #f6f8fa) !important;
}

[data-theme="light"] .exp-tt-kb-section--installed .exp-tt-kb-table thead th,
html[data-theme="light"] .exp-tt-kb-section--installed .exp-tt-kb-table thead th {
    color: var(--theme-success, #1a7f37) !important;
    background: var(--theme-bg-secondary, #f6f8fa) !important;
}

[data-theme="light"] .exp-tt-kb-section--pending-reboot .exp-tt-kb-table thead th,
html[data-theme="light"] .exp-tt-kb-section--pending-reboot .exp-tt-kb-table thead th {
    color: #9a6700 !important;
    background: var(--theme-bg-secondary, #f6f8fa) !important;
}

[data-theme="light"] .exp-tt-kb-section--failed-install .exp-tt-kb-table thead th,
html[data-theme="light"] .exp-tt-kb-section--failed-install .exp-tt-kb-table thead th {
    color: #bc4c00 !important;
    background: var(--theme-bg-secondary, #f6f8fa) !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--patched,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--patched {
    color: var(--theme-success, #1a7f37) !important;
    background: rgba(26, 127, 55, 0.12) !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--missing,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--missing {
    color: var(--theme-danger, #cf222e) !important;
    background: rgba(207, 34, 46, 0.12) !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--pending-reboot,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--pending-reboot {
    color: #9a6700 !important;
    background: rgba(154, 103, 0, 0.16) !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--failed-install,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-drilldown-detail-pill--failed-install {
    color: #bc4c00 !important;
    background: rgba(188, 76, 0, 0.16) !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-allclear,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-allclear {
    color: var(--theme-success, #1a7f37) !important;
    background: rgba(26, 127, 55, 0.08) !important;
    border-color: rgba(26, 127, 55, 0.25) !important;
}

[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-allclear span,
html[data-theme="light"] .exp-drilldown-detail-tooltip .exp-tt-kb-allclear span {
    color: var(--theme-success, #1a7f37) !important;
}

[data-theme="light"] .exp-tt-kb-section--missing,
html[data-theme="light"] .exp-tt-kb-section--missing {
    border-color: rgba(207, 34, 46, 0.25) !important;
}

[data-theme="light"] .exp-tt-kb-section--installed,
html[data-theme="light"] .exp-tt-kb-section--installed {
    border-color: rgba(26, 127, 55, 0.25) !important;
}

[data-theme="light"] .exp-tt-kb-section--pending-reboot,
html[data-theme="light"] .exp-tt-kb-section--pending-reboot {
    border-color: rgba(154, 103, 0, 0.28) !important;
}

[data-theme="light"] .exp-tt-kb-section--failed-install,
html[data-theme="light"] .exp-tt-kb-section--failed-install {
    border-color: rgba(188, 76, 0, 0.28) !important;
}

/* Primary Button (Generate Report) */
[data-theme="light"] .exp-btn-primary,
html[data-theme="light"] .exp-btn-primary {
    background: linear-gradient(135deg, var(--theme-accent-blue) 0%, var(--theme-accent-blue-dark) 100%) !important;
    color: var(--theme-text-inverse) !important;
}

/* =============================================================================
   PAGE HEADER - Matching alerts-page-header style for Exposure pages
   ============================================================================= */

#exposure-summary-page .alerts-page-header,
#exposure-details-page .alerts-page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0;
    padding-top: 8px;
    margin-bottom: 16px;
}

#exposure-summary-page .alerts-header-left,
#exposure-details-page .alerts-header-left {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

#exposure-summary-page .alerts-header-title,
#exposure-details-page .alerts-header-title {
    margin: 0;
    font-size: 24px;
    font-weight: 600;
    color: var(--db-text-primary, #e6edf3);
}

#exposure-summary-page .alerts-header-subtitle,
#exposure-details-page .alerts-header-subtitle {
    margin: 4px 0 0 0;
    font-size: 13px;
    color: var(--db-text-secondary, #8b949e);
}

/* Light theme - page header */
[data-theme="light"] #exposure-summary-page .alerts-header-title,
[data-theme="light"] #exposure-details-page .alerts-header-title,
html[data-theme="light"] #exposure-summary-page .alerts-header-title,
html[data-theme="light"] #exposure-details-page .alerts-header-title {
    color: var(--theme-text-primary);
}

[data-theme="light"] #exposure-summary-page .alerts-header-subtitle,
[data-theme="light"] #exposure-details-page .alerts-header-subtitle,
html[data-theme="light"] #exposure-summary-page .alerts-header-subtitle,
html[data-theme="light"] #exposure-details-page .alerts-header-subtitle {
    color: var(--theme-text-secondary);
}

/* Exposure icon styling - purple/cyan gradient */
#exposure-summary-page .alerts-header-icon--exposure,
#exposure-details-page .alerts-header-icon--exposure {
    background: linear-gradient(145deg, rgba(163, 113, 247, 0.25) 0%, rgba(163, 113, 247, 0.12) 100%);
    color: #a371f7;
}

[data-theme="light"] #exposure-summary-page .alerts-header-icon--exposure,
[data-theme="light"] #exposure-details-page .alerts-header-icon--exposure,
html[data-theme="light"] #exposure-summary-page .alerts-header-icon--exposure,
html[data-theme="light"] #exposure-details-page .alerts-header-icon--exposure {
    background: linear-gradient(145deg, rgba(163, 113, 247, 0.15) 0%, rgba(163, 113, 247, 0.08) 100%);
}

/* alerts-header-title-row for Exposure pages */
#exposure-summary-page .alerts-header-title-row,
#exposure-details-page .alerts-header-title-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* alerts-header-icon base styling for Exposure pages */
#exposure-summary-page .alerts-header-icon,
#exposure-details-page .alerts-header-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

/* alerts-header-right for Exposure pages */
#exposure-summary-page .alerts-header-right,
#exposure-details-page .alerts-header-right {
    display: flex;
    align-items: center;
}

/* alerts-context-badge for Exposure pages */
#exposure-summary-page .alerts-context-badge,
#exposure-details-page .alerts-context-badge {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(54, 127, 211, 0.12);
    border: 1px solid rgba(54, 127, 211, 0.3);
    border-radius: 8px;
    padding: 10px 14px;
    color: var(--db-text-primary, #e6edf3);
    font-size: 12px;
    max-width: 420px;
    text-align: left;
}

#exposure-summary-page .alerts-context-badge i,
#exposure-details-page .alerts-context-badge i {
    color: var(--db-accent-blue, #58a6ff);
    font-size: 14px;
    flex-shrink: 0;
}

#exposure-summary-page .alerts-context-badge .context-highlight,
#exposure-details-page .alerts-context-badge .context-highlight {
    color: var(--db-accent-cyan, #58a6ff);
}

/* Light theme - alerts-context-badge */
[data-theme="light"] #exposure-summary-page .alerts-context-badge,
[data-theme="light"] #exposure-details-page .alerts-context-badge,
html[data-theme="light"] #exposure-summary-page .alerts-context-badge,
html[data-theme="light"] #exposure-details-page .alerts-context-badge {
    background: rgba(54, 127, 211, 0.08);
    border-color: rgba(54, 127, 211, 0.25);
    color: var(--theme-text-primary);
}

/* =============================================================================
   COMPANY CONTEXT NOTE - Matching dashboard style for Exposure pages
   ============================================================================= */

#exposure-summary-page .db-company-context-note,
#exposure-details-page .db-company-context-note {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(54, 127, 211, 0.12);
    border: 1px solid rgba(54, 127, 211, 0.3);
    border-radius: 10px;
    padding: 12px 16px;
    margin-bottom: 20px;
    color: var(--db-text-primary, #e6edf3);
    font-size: 13px;
}

#exposure-summary-page .db-company-context-note i,
#exposure-details-page .db-company-context-note i {
    color: var(--db-accent-blue, #367fd3);
    font-size: 16px;
}

#exposure-summary-page .db-company-context-note .context-highlight,
#exposure-details-page .db-company-context-note .context-highlight {
    color: var(--db-accent-cyan, #58a6ff);
}

/* Light theme - company context note */
[data-theme="light"] #exposure-summary-page .db-company-context-note,
[data-theme="light"] #exposure-details-page .db-company-context-note,
html[data-theme="light"] #exposure-summary-page .db-company-context-note,
html[data-theme="light"] #exposure-details-page .db-company-context-note {
    background: rgba(54, 127, 211, 0.08);
    border-color: rgba(54, 127, 211, 0.25);
    color: var(--theme-text-primary);
}

[data-theme="light"] #exposure-summary-page .db-company-context-note .context-highlight,
[data-theme="light"] #exposure-details-page .db-company-context-note .context-highlight,
html[data-theme="light"] #exposure-summary-page .db-company-context-note .context-highlight,
html[data-theme="light"] #exposure-details-page .db-company-context-note .context-highlight {
    color: var(--theme-accent-blue);
}

/* =============================================================================
   EXPOSURE DASHBOARD V4 (SUMMARY PAGE ONLY)
   ============================================================================= */

#exposure-summary-page.expd-page {
    --expd-bg-card: linear-gradient(145deg, rgba(23, 30, 41, 0.92), rgba(17, 23, 31, 0.96));
    --expd-border: rgba(255, 255, 255, 0.1);
    --expd-border-strong: rgba(255, 255, 255, 0.16);
    --expd-text: #e6edf3;
    --expd-muted: #8b949e;
    --expd-subtle: #6e7681;
    --expd-blue: #58a6ff;
    --expd-cyan: #79c0ff;
    --expd-green: #3fb950;
    --expd-yellow: #d29922;
    --expd-orange: #f0883e;
    --expd-red: #f85149;
    --expd-red-deep: #da3633;
}

#exposure-summary-page.expd-page .expd-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

#exposure-summary-page.expd-page .expd-refresh {
    border: 1px solid var(--expd-border);
    background: rgba(255, 255, 255, 0.03);
    color: var(--expd-muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.01em;
    border-radius: 8px;
    padding: 9px 14px;
    transition: all 0.16s ease;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

#exposure-summary-page.expd-page .expd-refresh--header {
    min-height: 40px;
}

#exposure-summary-page.expd-page .expd-refresh--header span {
    font-weight: 600;
}

#exposure-summary-page.expd-page .expd-refresh:hover {
    border-color: rgba(88, 166, 255, 0.42);
    color: var(--expd-text);
    background: rgba(88, 166, 255, 0.1);
}

#exposure-summary-page.expd-page .expd-refresh[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
}

#exposure-summary-page.expd-page .expd-warning,
#exposure-summary-page.expd-page .expd-error {
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 10px;
    padding: 11px 14px;
    font-size: 13px;
    margin-bottom: 12px;
}

#exposure-summary-page.expd-page .expd-warning {
    color: #fbd38d;
    border: 1px solid rgba(251, 211, 141, 0.35);
    background: rgba(251, 211, 141, 0.12);
}

#exposure-summary-page.expd-page .expd-error {
    color: #ffb4af;
    border: 1px solid rgba(248, 81, 73, 0.4);
    background: rgba(248, 81, 73, 0.14);
}

#exposure-summary-page.expd-page .expd-loading-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 14px;
    margin: 14px 0 6px 0;
}

#exposure-summary-page.expd-page .expd-skeleton {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--expd-border);
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.04) 20%, rgba(255, 255, 255, 0.08) 38%, rgba(255, 255, 255, 0.04) 56%);
    background-size: 220% 100%;
    animation: expdShimmer 1.7s linear infinite;
}

#exposure-summary-page.expd-page .expd-skeleton--posture {
    grid-column: span 12;
    min-height: 158px;
}

#exposure-summary-page.expd-page .expd-skeleton--card {
    grid-column: span 3;
    min-height: 220px;
}

#exposure-summary-page.expd-page .expd-skeleton--table {
    grid-column: span 8;
    min-height: 340px;
}

#exposure-summary-page.expd-page .expd-skeleton--side {
    grid-column: span 4;
    min-height: 340px;
}

#exposure-summary-page.expd-page .expd-skeleton--line {
    grid-column: span 12;
    min-height: 330px;
}

#exposure-summary-page.expd-page .expd-skeleton--chart {
    grid-column: span 6;
    min-height: 280px;
}

#exposure-summary-page.expd-page .expd-posture-card--skeleton {
    padding: 12px;
}

#exposure-summary-page.expd-page .expd-posture-card--skeleton .expd-skeleton {
    border: 0;
}

#exposure-summary-page.expd-page .expd-skeleton--posture-inline {
    min-height: 158px;
}

#exposure-summary-page.expd-page .expd-skeleton--card-inline {
    min-height: 214px;
    border: 0;
    border-radius: 11px;
}

#exposure-summary-page.expd-page .expd-panel-skeleton .expd-skeleton {
    border: 0;
    border-radius: 10px;
}

#exposure-summary-page.expd-page .expd-skeleton--table-inline {
    min-height: 340px;
}

#exposure-summary-page.expd-page .expd-skeleton--fleet-inline {
    min-height: 165px;
}

#exposure-summary-page.expd-page .expd-skeleton--endpoints-inline {
    min-height: 215px;
}

@keyframes expdShimmer {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

#exposure-summary-page.expd-page .expd-posture-card,
#exposure-summary-page.expd-page .expd-card,
#exposure-summary-page.expd-page .expd-panel {
    background: var(--expd-bg-card);
    border: 1px solid var(--expd-border);
    border-radius: 12px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

#exposure-summary-page.expd-page .expd-posture-card {
    margin-bottom: 14px;
    padding: 16px 18px;
}

#exposure-summary-page.expd-page .expd-posture-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 14px;
}

#exposure-summary-page.expd-page .expd-posture-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--expd-text);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

#exposure-summary-page.expd-page .expd-posture-title i {
    color: #f7b955;
}

#exposure-summary-page.expd-page .expd-posture-context {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

#exposure-summary-page.expd-page .expd-ctx-item {
    min-width: 96px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 8px;
    padding: 8px 10px;
    background: rgba(255, 255, 255, 0.03);
    text-align: center;
}

#exposure-summary-page.expd-page .expd-ctx-value {
    color: var(--expd-text);
    font-size: 20px;
    line-height: 1.1;
    font-weight: 700;
}

#exposure-summary-page.expd-page .expd-ctx-label {
    font-size: 11px;
    color: var(--expd-subtle);
    letter-spacing: 0.02em;
    margin-top: 3px;
}

#exposure-summary-page.expd-page .expd-posture-empty {
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(63, 185, 80, 0.35);
    background: rgba(63, 185, 80, 0.1);
    color: #8be28f;
    border-radius: 10px;
    padding: 14px;
    font-weight: 600;
    max-width: 100%;
    margin-bottom: 10px;
}

#exposure-summary-page.expd-page .expd-posture-empty i {
    margin-right: 6px;
}

#exposure-summary-page.expd-page .expd-posture-card--empty .expd-posture-empty {
    width: auto;
}

#exposure-summary-page.expd-page .expd-posture-bar {
    display: flex;
    align-items: stretch;
    min-height: 44px;
    border-radius: 9px;
    overflow: hidden;
    border: 1px solid var(--expd-border);
    margin-bottom: 12px;
}

#exposure-summary-page.expd-page .expd-posture-seg {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    font-size: 12px;
    color: #ffffff;
    font-weight: 700;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
    white-space: nowrap;
    min-width: 48px;
}

#exposure-summary-page.expd-page .expd-posture-seg--kev {
    background: linear-gradient(90deg, #f85149, #da3633);
}

#exposure-summary-page.expd-page .expd-posture-seg--critical {
    background: linear-gradient(90deg, #f0883e, #d0782f);
}

#exposure-summary-page.expd-page .expd-posture-seg--high {
    background: linear-gradient(90deg, #d29922, #b7811e);
}

#exposure-summary-page.expd-page .expd-posture-seg--other {
    background: linear-gradient(90deg, #58a6ff, #367fd3);
}

#exposure-summary-page.expd-page .expd-posture-legend {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

#exposure-summary-page.expd-page .expd-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.03);
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 12px;
}

#exposure-summary-page.expd-page .expd-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    display: inline-block;
}

#exposure-summary-page.expd-page .expd-dot--kev {
    background: var(--expd-red);
}

#exposure-summary-page.expd-page .expd-dot--critical {
    background: var(--expd-orange);
}

#exposure-summary-page.expd-page .expd-dot--high {
    background: var(--expd-yellow);
}

#exposure-summary-page.expd-page .expd-dot--other {
    background: var(--expd-blue);
}

#exposure-summary-page.expd-page .expd-label {
    color: var(--expd-muted);
}

#exposure-summary-page.expd-page .expd-count {
    color: var(--expd-text);
    font-weight: 700;
}

#exposure-summary-page.expd-page .expd-toggle {
    margin-left: auto;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: transparent;
    color: var(--expd-muted);
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 10px;
    transition: all 0.15s ease;
}

#exposure-summary-page.expd-page .expd-toggle:hover {
    color: var(--expd-text);
    border-color: rgba(88, 166, 255, 0.4);
    background: rgba(88, 166, 255, 0.08);
}

#exposure-summary-page.expd-page .expd-posture-detail {
    margin-top: 10px;
    color: var(--expd-muted);
    font-size: 12px;
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

#exposure-summary-page.expd-page .expd-posture-detail strong {
    color: var(--expd-text);
}

#exposure-summary-page.expd-page .expd-metrics-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
}

#exposure-summary-page.expd-page .expd-card {
    position: relative;
    overflow: hidden;
    padding: 14px;
    min-height: 214px;
    transition: transform 0.17s ease, border-color 0.17s ease, box-shadow 0.17s ease;
    cursor: default;
}

#exposure-summary-page.expd-page .expd-card--skeleton {
    padding: 0;
    cursor: default;
}

#exposure-summary-page.expd-page .expd-card.is-loading {
    cursor: default;
}

#exposure-summary-page.expd-page .expd-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 3px;
    background: rgba(255, 255, 255, 0.2);
}

#exposure-summary-page.expd-page .expd-card--skeleton::before {
    display: none;
}

#exposure-summary-page.expd-page .expd-card--kev::before {
    background: linear-gradient(90deg, var(--expd-red), var(--expd-red-deep));
}

#exposure-summary-page.expd-page .expd-card--risk::before {
    background: linear-gradient(90deg, var(--expd-orange), var(--expd-yellow));
}

#exposure-summary-page.expd-page .expd-card--patching::before {
    background: linear-gradient(90deg, #58a6ff, #3fb950);
}

#exposure-summary-page.expd-page .expd-card--neglected::before {
    background: linear-gradient(90deg, #f0883e, #f85149);
}

#exposure-summary-page.expd-page .expd-card:hover {
    transform: translateY(-2px);
    border-color: var(--expd-border-strong);
    box-shadow: 0 18px 30px rgba(0, 0, 0, 0.32);
}

#exposure-summary-page.expd-page .expd-card--skeleton:hover {
    transform: none;
    border-color: var(--expd-border);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

#exposure-summary-page.expd-page .expd-card.is-loading:hover {
    transform: none;
    border-color: var(--expd-border);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

#exposure-summary-page.expd-page .expd-card--kev,
#exposure-summary-page.expd-page .expd-card--risk,
#exposure-summary-page.expd-page .expd-card--neglected {
    cursor: pointer;
}

#exposure-summary-page.expd-page .expd-card-top {
    display: flex;
    gap: 10px;
    margin-bottom: 12px;
}

#exposure-summary-page.expd-page .expd-icon {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(88, 166, 255, 0.14);
    color: #7bb9ff;
}

#exposure-summary-page.expd-page .expd-card--kev .expd-icon {
    background: rgba(248, 81, 73, 0.16);
    color: #ff8b84;
}

#exposure-summary-page.expd-page .expd-card--risk .expd-icon,
#exposure-summary-page.expd-page .expd-card--neglected .expd-icon {
    background: rgba(240, 136, 62, 0.18);
    color: #f7bb87;
}

#exposure-summary-page.expd-page .expd-card-title {
    color: var(--expd-text);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
}

#exposure-summary-page.expd-page .expd-card-subtitle {
    color: var(--expd-muted);
    font-size: 12px;
    margin-top: 2px;
    line-height: 1.35;
}

#exposure-summary-page.expd-page .expd-card-value {
    color: var(--expd-text);
    font-size: 32px;
    line-height: 1.1;
    font-weight: 800;
    margin-bottom: 10px;
}

#exposure-summary-page.expd-page .expd-value-skeleton {
    border: 0;
    border-radius: 8px;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.04) 20%, rgba(255, 255, 255, 0.08) 38%, rgba(255, 255, 255, 0.04) 56%);
    background-size: 220% 100%;
    animation: expdShimmer 1.7s linear infinite;
    margin-bottom: 10px;
}

#exposure-summary-page.expd-page .expd-value-skeleton--lg {
    width: 122px;
    height: 34px;
}

#exposure-summary-page.expd-page .expd-value-skeleton--sm {
    width: 68px;
    height: 22px;
    margin: 0 auto 4px auto;
    border-radius: 6px;
}

#exposure-summary-page.expd-page .expd-card-inline {
    font-size: 13px;
    color: var(--expd-muted);
    font-weight: 500;
}

#exposure-summary-page.expd-page .expd-zero {
    color: var(--expd-subtle);
    font-size: 12px;
    margin-top: 8px;
}

#exposure-summary-page.expd-page .expd-mini-bar {
    width: 100%;
    height: 9px;
    border-radius: 8px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.07);
    display: flex;
    margin-bottom: 10px;
}

#exposure-summary-page.expd-page .expd-mini-seg {
    height: 100%;
}

#exposure-summary-page.expd-page .expd-mini-seg--danger {
    background: linear-gradient(90deg, #f85149, #da3633);
}

#exposure-summary-page.expd-page .expd-mini-seg--kev {
    background: linear-gradient(90deg, #f0883e, #d29922);
}

#exposure-summary-page.expd-page .expd-mini-seg--warn {
    background: linear-gradient(90deg, #f0b429, #d29922);
}

#exposure-summary-page.expd-page .expd-mini-seg--ok {
    background: linear-gradient(90deg, #3fb950, #2ea043);
}

#exposure-summary-page.expd-page .expd-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

#exposure-summary-page.expd-page .expd-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    color: var(--expd-muted);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 999px;
    padding: 3px 8px;
    background: rgba(255, 255, 255, 0.03);
}

#exposure-summary-page.expd-page .expd-pill strong {
    color: var(--expd-text);
}

#exposure-summary-page.expd-page .expd-pill--danger {
    border-color: rgba(248, 81, 73, 0.35);
    color: #ffb4af;
    background: rgba(248, 81, 73, 0.1);
}

#exposure-summary-page.expd-page .expd-pill--warn {
    border-color: rgba(240, 184, 41, 0.35);
    color: #ffd58b;
    background: rgba(240, 184, 41, 0.1);
}

#exposure-summary-page.expd-page .expd-pill--ok {
    border-color: rgba(63, 185, 80, 0.35);
    color: #9be7a4;
    background: rgba(63, 185, 80, 0.1);
}

#exposure-summary-page.expd-page .expd-progress-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0 10px 0;
}

#exposure-summary-page.expd-page .expd-progress-item {
    flex: 1;
    min-width: 0;
    text-align: center;
}

#exposure-summary-page.expd-page .expd-progress-divider {
    width: 1px;
    align-self: stretch;
    background: rgba(255, 255, 255, 0.12);
}

#exposure-summary-page.expd-page .expd-progress-number {
    font-size: 23px;
    line-height: 1.1;
    font-weight: 800;
    color: var(--expd-text);
}

#exposure-summary-page.expd-page .expd-progress-number--new {
    color: #ff9892;
}

#exposure-summary-page.expd-page .expd-progress-number--patched {
    color: #93dfa2;
}

#exposure-summary-page.expd-page .expd-progress-label {
    color: var(--expd-subtle);
    font-size: 11px;
    margin-top: 3px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

#exposure-summary-page.expd-page .expd-net {
    font-size: 22px;
    line-height: 1.1;
    font-weight: 800;
}

#exposure-summary-page.expd-page .expd-net--ok {
    color: #72df8f;
}

#exposure-summary-page.expd-page .expd-net--danger {
    color: #ff9d98;
}

#exposure-summary-page.expd-page .expd-net--neutral {
    color: var(--expd-muted);
}

#exposure-summary-page.expd-page .expd-banner {
    margin-top: 10px;
    border-radius: 8px;
    padding: 8px 10px;
    font-size: 12px;
    border: 1px solid transparent;
    display: flex;
    align-items: center;
    gap: 8px;
}

#exposure-summary-page.expd-page .expd-banner--ok {
    color: #9be7a4;
    background: rgba(63, 185, 80, 0.12);
    border-color: rgba(63, 185, 80, 0.34);
}

#exposure-summary-page.expd-page .expd-banner--warn {
    color: #ffe09a;
    background: rgba(240, 184, 41, 0.12);
    border-color: rgba(240, 184, 41, 0.34);
}

#exposure-summary-page.expd-page .expd-banner--orange {
    color: #ffd0a3;
    background: rgba(240, 136, 62, 0.14);
    border-color: rgba(240, 136, 62, 0.34);
}

#exposure-summary-page.expd-page .expd-banner--danger {
    color: #ffb4af;
    background: rgba(248, 81, 73, 0.14);
    border-color: rgba(248, 81, 73, 0.34);
}

#exposure-summary-page.expd-page .expd-banner--neutral {
    color: #b7c0ca;
    background: rgba(139, 148, 158, 0.16);
    border-color: rgba(139, 148, 158, 0.32);
}

#exposure-summary-page.expd-page .expd-aging-labels {
    display: flex;
    justify-content: space-between;
    color: var(--expd-subtle);
    font-size: 10px;
    margin-bottom: 5px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

#exposure-summary-page.expd-page .expd-aging-bar {
    width: 100%;
    height: 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
    margin-bottom: 10px;
}

#exposure-summary-page.expd-page .expd-aging-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #f0b429, #f85149);
}

#exposure-summary-page.expd-page .expd-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr);
    gap: 12px;
    margin-bottom: 8px;
}

#exposure-summary-page.expd-page .expd-side-stack {
    display: grid;
    grid-auto-rows: min-content;
    gap: 12px;
}

#exposure-summary-page.expd-page .expd-panel {
    padding: 14px;
}

#exposure-summary-page.expd-page .expd-panel-skeleton {
    width: 100%;
}

#exposure-summary-page.expd-page .expd-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

#exposure-summary-page.expd-page .expd-panel-title {
    color: var(--expd-text);
    font-size: 14px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

#exposure-summary-page.expd-page .expd-panel-title i {
    color: var(--expd-blue);
}

#exposure-summary-page.expd-page .expd-panel-action {
    color: var(--expd-muted);
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}

#exposure-summary-page.expd-page .expd-panel-action:hover {
    color: var(--expd-cyan);
}

#exposure-summary-page.expd-page .expd-table-wrap {
    overflow-x: auto;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
}

#exposure-summary-page.expd-page .expd-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 760px;
}

#exposure-summary-page.expd-page .expd-table th,
#exposure-summary-page.expd-page .expd-table td {
    padding: 10px 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    font-size: 12px;
    vertical-align: middle;
}

#exposure-summary-page.expd-page .expd-table th {
    color: var(--expd-subtle);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 11px;
    font-weight: 700;
    background: rgba(255, 255, 255, 0.03);
}

#exposure-summary-page.expd-page .expd-table tbody tr {
    transition: background-color 0.14s ease;
    cursor: pointer;
}

#exposure-summary-page.expd-page .expd-table tbody tr:hover {
    background: rgba(88, 166, 255, 0.08);
}

#exposure-summary-page.expd-page .expd-rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    color: #d9e0e8;
    background: rgba(255, 255, 255, 0.1);
}

#exposure-summary-page.expd-page .expd-rank--top {
    background: linear-gradient(145deg, #f85149, #da3633);
    color: #fff;
}

#exposure-summary-page.expd-page .expd-rank--high {
    background: linear-gradient(145deg, #f0883e, #d29922);
    color: #fff;
}

#exposure-summary-page.expd-page .expd-rank--mid {
    background: linear-gradient(145deg, #58a6ff, #367fd3);
    color: #fff;
}

#exposure-summary-page.expd-page .expd-rank--normal {
    background: rgba(255, 255, 255, 0.09);
}

#exposure-summary-page.expd-page .expd-cve-cell {
    white-space: nowrap;
}

#exposure-summary-page.expd-page .expd-cve-link {
    color: #8fc6ff;
    font-weight: 700;
    margin-right: 6px;
}

#exposure-summary-page.expd-page .expd-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: 999px;
    padding: 2px 7px;
    font-size: 10px;
    font-weight: 700;
    margin-left: 4px;
}

#exposure-summary-page.expd-page .expd-badge--kev {
    background: rgba(248, 81, 73, 0.16);
    color: #ffb4af;
    border: 1px solid rgba(248, 81, 73, 0.34);
}

#exposure-summary-page.expd-page .expd-badge--rw {
    background: rgba(240, 136, 62, 0.16);
    color: #ffd0a3;
    border: 1px solid rgba(240, 136, 62, 0.34);
}

#exposure-summary-page.expd-page .expd-score {
    border-radius: 6px;
    font-size: 11px;
    font-weight: 800;
    padding: 2px 8px;
}

#exposure-summary-page.expd-page .expd-score--critical {
    color: #fff;
    background: linear-gradient(135deg, #f85149, #da3633);
}

#exposure-summary-page.expd-page .expd-score--high {
    color: #fff;
    background: linear-gradient(135deg, #f0883e, #d29922);
}

#exposure-summary-page.expd-page .expd-score--medium {
    color: #fff;
    background: linear-gradient(135deg, #58a6ff, #367fd3);
}

#exposure-summary-page.expd-page .expd-score--low {
    color: #d9e0e8;
    background: rgba(139, 148, 158, 0.26);
}

#exposure-summary-page.expd-page .expd-sev {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 3px 8px;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 700;
}

#exposure-summary-page.expd-page .expd-sev--critical {
    color: #ffb4af;
    background: rgba(248, 81, 73, 0.14);
    border: 1px solid rgba(248, 81, 73, 0.34);
}

#exposure-summary-page.expd-page .expd-sev--high {
    color: #ffd6a0;
    background: rgba(240, 136, 62, 0.14);
    border: 1px solid rgba(240, 136, 62, 0.34);
}

#exposure-summary-page.expd-page .expd-age {
    color: var(--expd-muted);
    font-size: 11px;
    font-weight: 700;
}

#exposure-summary-page.expd-page .expd-age--stale {
    color: #ffc870;
}

#exposure-summary-page.expd-page .expd-age--old {
    color: #ff9d98;
}

#exposure-summary-page.expd-page .expd-product {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--expd-muted);
    display: inline-block;
}

#exposure-summary-page.expd-page .expd-nav-btn {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: rgba(255, 255, 255, 0.04);
    color: var(--expd-muted);
    transition: all 0.16s ease;
}

#exposure-summary-page.expd-page .expd-nav-btn:hover {
    color: var(--expd-text);
    border-color: rgba(88, 166, 255, 0.4);
    background: rgba(88, 166, 255, 0.12);
}

#exposure-summary-page.expd-page .expd-small {
    color: var(--expd-subtle);
    font-size: 12px;
}

#exposure-summary-page.expd-page .expd-fleet-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

#exposure-summary-page.expd-page .expd-fleet-bar {
    width: 100%;
    height: 12px;
    display: flex;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

#exposure-summary-page.expd-page .expd-fleet-seg {
    height: 100%;
}

#exposure-summary-page.expd-page .expd-fleet-seg--v {
    background: linear-gradient(90deg, #f85149, #f0883e);
}

#exposure-summary-page.expd-page .expd-fleet-seg--c {
    background: linear-gradient(90deg, #3fb950, #2ea043);
}

#exposure-summary-page.expd-page .expd-fleet-stats {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

#exposure-summary-page.expd-page .expd-fleet-value {
    font-size: 24px;
    line-height: 1.05;
    font-weight: 800;
}

#exposure-summary-page.expd-page .expd-fleet-value--v {
    color: #ffaba6;
}

#exposure-summary-page.expd-page .expd-fleet-value--c {
    color: #9be7a4;
}

#exposure-summary-page.expd-page .expd-fleet-label {
    color: var(--expd-muted);
    font-size: 12px;
}

#exposure-summary-page.expd-page .expd-endpoint-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    margin-bottom: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
}

#exposure-summary-page.expd-page .expd-endpoint-item:hover {
    border-color: rgba(88, 166, 255, 0.35);
    background: rgba(88, 166, 255, 0.1);
}

#exposure-summary-page.expd-page .expd-endpoint-name {
    color: var(--expd-text);
    font-size: 12px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#exposure-summary-page.expd-page .expd-endpoint-badges {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

#exposure-summary-page.expd-page .expd-ep-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    border-radius: 999px;
    padding: 2px 7px;
    font-size: 10px;
    font-weight: 700;
    border: 1px solid transparent;
}

#exposure-summary-page.expd-page .expd-ep-badge--kev {
    color: #ffb4af;
    background: rgba(248, 81, 73, 0.14);
    border-color: rgba(248, 81, 73, 0.34);
}

#exposure-summary-page.expd-page .expd-ep-badge--crit {
    color: #ffd0a3;
    background: rgba(240, 136, 62, 0.14);
    border-color: rgba(240, 136, 62, 0.34);
}

#exposure-summary-page.expd-page .expd-ep-badge--high {
    color: #ffe09a;
    background: rgba(240, 184, 41, 0.14);
    border-color: rgba(240, 184, 41, 0.34);
}

#exposure-summary-page.expd-page .expd-ep-badge--total {
    color: #c8d1db;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.15);
}

#exposure-summary-page.expd-page .expd-empty {
    color: var(--expd-subtle);
    font-size: 12px;
    padding: 10px 0;
}

#exposure-summary-page.expd-page .expd-insights-wrap {
    margin-top: 8px;
}

#exposure-summary-page.expd-page .expd-insights-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

#exposure-summary-page.expd-page .expd-panel--line {
    grid-column: 1 / -1;
}

#exposure-summary-page.expd-page .expd-insight-chart {
    width: 100%;
    min-height: 290px;
}

#exposure-summary-page.expd-page .expd-panel--line .expd-insight-chart {
    min-height: 330px;
}

#exposure-summary-page.expd-page .expd-no-data {
    width: 100%;
    min-height: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--expd-subtle);
    font-size: 13px;
}

@media (max-width: 1300px) {
    #exposure-summary-page.expd-page .expd-metrics-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #exposure-summary-page.expd-page .expd-main-grid {
        grid-template-columns: 1fr;
    }

    #exposure-summary-page.expd-page .expd-side-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #exposure-summary-page.expd-page .expd-skeleton--card {
        grid-column: span 6;
    }

    #exposure-summary-page.expd-page .expd-skeleton--table,
    #exposure-summary-page.expd-page .expd-skeleton--side {
        grid-column: span 12;
    }
}

@media (max-width: 880px) {
    #exposure-summary-page.expd-page .expd-posture-top {
        flex-direction: column;
        align-items: stretch;
    }

    #exposure-summary-page.expd-page .expd-toggle {
        margin-left: 0;
    }

    #exposure-summary-page.expd-page .expd-side-stack {
        grid-template-columns: 1fr;
    }

    #exposure-summary-page.expd-page .expd-insights-grid {
        grid-template-columns: 1fr;
    }

    #exposure-summary-page.expd-page .expd-panel--line {
        grid-column: auto;
    }

    #exposure-summary-page.expd-page .expd-skeleton--line,
    #exposure-summary-page.expd-page .expd-skeleton--chart {
        grid-column: span 12;
    }
}

@media (max-width: 680px) {
    #exposure-summary-page.expd-page {
        padding: 0 14px;
    }

    #exposure-summary-page.expd-page .expd-metrics-row {
        grid-template-columns: 1fr;
    }

    #exposure-summary-page.expd-page .expd-card {
        min-height: 190px;
    }

    #exposure-summary-page.expd-page .expd-skeleton--card-inline {
        min-height: 190px;
    }

    #exposure-summary-page.expd-page .expd-card-value {
        font-size: 26px;
    }

    #exposure-summary-page.expd-page .expd-fleet-stats {
        flex-direction: column;
        gap: 8px;
    }

    #exposure-summary-page.expd-page .expd-skeleton--card {
        grid-column: span 12;
    }
}

[data-theme="light"] #exposure-summary-page.expd-page,
html[data-theme="light"] #exposure-summary-page.expd-page {
    --expd-bg-card: linear-gradient(145deg, rgba(255, 255, 255, 0.94), rgba(247, 250, 253, 0.98));
    --expd-border: rgba(15, 23, 42, 0.12);
    --expd-border-strong: rgba(15, 23, 42, 0.2);
    --expd-text: #111827;
    --expd-muted: #475569;
    --expd-subtle: #64748b;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-refresh,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-refresh {
    background: rgba(15, 23, 42, 0.03);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-skeleton,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-skeleton {
    background: linear-gradient(120deg, rgba(148, 163, 184, 0.13) 20%, rgba(148, 163, 184, 0.24) 38%, rgba(148, 163, 184, 0.13) 56%);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-value-skeleton,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-value-skeleton {
    background: linear-gradient(120deg, rgba(148, 163, 184, 0.13) 20%, rgba(148, 163, 184, 0.24) 38%, rgba(148, 163, 184, 0.13) 56%);
}

/* =============================================================================
   LIGHT THEME - Exposure Dashboard V4 (Summary Page)
   Comprehensive overrides for all hardcoded dark-theme colors
   ============================================================================= */

/* --- Card backgrounds & shadows --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-posture-card,
[data-theme="light"] #exposure-summary-page.expd-page .expd-card,
[data-theme="light"] #exposure-summary-page.expd-page .expd-panel,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-posture-card,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-card,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-panel {
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 4px 12px rgba(15, 23, 42, 0.06);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-card:hover,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-card:hover {
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.1), 0 8px 24px rgba(15, 23, 42, 0.08);
}

/* --- Posture section --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-posture-title i,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-posture-title i {
    color: #d97706;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-ctx-item,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-ctx-item {
    border-color: rgba(15, 23, 42, 0.1);
    background: rgba(241, 245, 249, 0.6);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-posture-empty,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-posture-empty {
    color: #16a34a;
    border-color: rgba(22, 163, 74, 0.3);
    background: rgba(22, 163, 74, 0.08);
}

/* Posture bar segments - keep gradients vivid on light */
[data-theme="light"] #exposure-summary-page.expd-page .expd-posture-seg,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-posture-seg {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-posture-bar,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-posture-bar {
    border-color: rgba(15, 23, 42, 0.1);
}

/* --- Legend items --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-legend-item,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-legend-item {
    border-color: rgba(15, 23, 42, 0.1);
    background: rgba(241, 245, 249, 0.6);
}

/* --- Toggle button --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-toggle,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-toggle {
    border-color: rgba(15, 23, 42, 0.15);
    color: #475569;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-toggle:hover,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-toggle:hover {
    color: #1e293b;
    border-color: rgba(37, 99, 235, 0.4);
    background: rgba(37, 99, 235, 0.06);
}

/* --- Card icons --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-icon,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-icon {
    background: rgba(37, 99, 235, 0.1);
    color: #2563eb;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-card--kev .expd-icon,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-card--kev .expd-icon {
    background: rgba(220, 38, 38, 0.1);
    color: #dc2626;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-card--risk .expd-icon,
[data-theme="light"] #exposure-summary-page.expd-page .expd-card--neglected .expd-icon,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-card--risk .expd-icon,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-card--neglected .expd-icon {
    background: rgba(217, 119, 6, 0.1);
    color: #d97706;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-card--patching .expd-icon,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-card--patching .expd-icon {
    background: rgba(22, 163, 74, 0.1);
    color: #16a34a;
}

/* --- Mini bars background --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-mini-bar,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-mini-bar {
    background: rgba(15, 23, 42, 0.06);
}

/* --- Pills: light theme contrast fix --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-pill,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-pill {
    color: #475569;
    border-color: rgba(15, 23, 42, 0.12);
    background: rgba(241, 245, 249, 0.7);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-pill strong,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-pill strong {
    color: #1e293b;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--danger,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--danger {
    border-color: rgba(220, 38, 38, 0.25);
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.06);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--danger strong,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--danger strong {
    color: #b91c1c;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--warn,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--warn {
    border-color: rgba(217, 119, 6, 0.25);
    color: #92400e;
    background: rgba(217, 119, 6, 0.06);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--warn strong,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--warn strong {
    color: #92400e;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--ok,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--ok {
    border-color: rgba(22, 163, 74, 0.25);
    color: #15803d;
    background: rgba(22, 163, 74, 0.06);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--ok strong,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-pill--ok strong {
    color: #15803d;
}

/* --- Progress numbers (patching card) --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-progress-number--new,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-progress-number--new {
    color: #dc2626;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-progress-number--patched,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-progress-number--patched {
    color: #16a34a;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-progress-divider,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-progress-divider {
    background: rgba(15, 23, 42, 0.1);
}

/* --- Net value colors --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-net--ok,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-net--ok {
    color: #16a34a;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-net--danger,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-net--danger {
    color: #dc2626;
}

/* --- Banners --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-banner--ok,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-banner--ok {
    color: #15803d;
    background: rgba(22, 163, 74, 0.08);
    border-color: rgba(22, 163, 74, 0.2);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-banner--warn,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-banner--warn {
    color: #92400e;
    background: rgba(245, 158, 11, 0.08);
    border-color: rgba(245, 158, 11, 0.2);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-banner--orange,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-banner--orange {
    color: #9a3412;
    background: rgba(234, 88, 12, 0.08);
    border-color: rgba(234, 88, 12, 0.2);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-banner--danger,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-banner--danger {
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.07);
    border-color: rgba(220, 38, 38, 0.2);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-banner--neutral,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-banner--neutral {
    color: #475569;
    background: rgba(100, 116, 139, 0.08);
    border-color: rgba(100, 116, 139, 0.18);
}

/* --- Aging bar background --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-aging-bar,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-aging-bar {
    background: rgba(15, 23, 42, 0.06);
}

/* --- Warning & Error banners --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-warning,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-warning {
    color: #92400e;
    border-color: rgba(245, 158, 11, 0.3);
    background: rgba(245, 158, 11, 0.08);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-error,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-error {
    color: #b91c1c;
    border-color: rgba(220, 38, 38, 0.3);
    background: rgba(220, 38, 38, 0.07);
}

/* --- Table --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-table-wrap,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-table-wrap {
    border-color: rgba(15, 23, 42, 0.1);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-table th,
[data-theme="light"] #exposure-summary-page.expd-page .expd-table td,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-table th,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-table td {
    border-bottom-color: rgba(15, 23, 42, 0.07);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-table th,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-table th {
    background: rgba(241, 245, 249, 0.7);
    color: #475569;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-table tbody tr:hover,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-table tbody tr:hover {
    background: rgba(37, 99, 235, 0.04);
}

/* --- CVE link --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-cve-link,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-cve-link {
    color: #2563eb;
}

/* --- Rank badges --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-rank,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-rank {
    color: #475569;
    background: rgba(15, 23, 42, 0.06);
}

/* --- KEV & RW badges --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-badge--kev,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-badge--kev {
    background: rgba(220, 38, 38, 0.1);
    color: #b91c1c;
    border-color: rgba(220, 38, 38, 0.25);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-badge--rw,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-badge--rw {
    background: rgba(217, 119, 6, 0.1);
    color: #92400e;
    border-color: rgba(217, 119, 6, 0.25);
}

/* --- Severity badges --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-sev--critical,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-sev--critical {
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.1);
    border-color: rgba(220, 38, 38, 0.25);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-sev--high,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-sev--high {
    color: #92400e;
    background: rgba(217, 119, 6, 0.1);
    border-color: rgba(217, 119, 6, 0.25);
}

/* --- Score badges --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-score--critical,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-score--critical {
    color: #ffffff;
    background: linear-gradient(135deg, #dc2626, #b91c1c);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-score--high,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-score--high {
    color: #ffffff;
    background: linear-gradient(135deg, #d97706, #b45309);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-score--medium,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-score--medium {
    color: #ffffff;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-score--low,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-score--low {
    color: #475569;
    background: rgba(100, 116, 139, 0.12);
}

/* --- Age colors --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-age--stale,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-age--stale {
    color: #d97706;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-age--old,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-age--old {
    color: #dc2626;
}

/* --- Nav button --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-nav-btn,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-nav-btn {
    border-color: rgba(15, 23, 42, 0.12);
    background: rgba(241, 245, 249, 0.6);
    color: #64748b;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-nav-btn:hover,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-nav-btn:hover {
    color: #2563eb;
    border-color: rgba(37, 99, 235, 0.3);
    background: rgba(37, 99, 235, 0.06);
}

/* --- Panel action link --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-panel-action,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-panel-action {
    color: #2563eb;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-panel-action:hover,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-panel-action:hover {
    color: #1d4ed8;
}

/* --- Panel title icon --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-panel-title i,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-panel-title i {
    color: #2563eb;
}

/* --- Fleet health section --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-fleet-bar,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-fleet-bar {
    background: rgba(15, 23, 42, 0.06);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-fleet-value--v,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-fleet-value--v {
    color: #dc2626;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-fleet-value--c,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-fleet-value--c {
    color: #16a34a;
}

/* --- Endpoint items --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-endpoint-item,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-endpoint-item {
    border-color: rgba(15, 23, 42, 0.08);
    background: rgba(241, 245, 249, 0.5);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-endpoint-item:hover,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-endpoint-item:hover {
    border-color: rgba(37, 99, 235, 0.25);
    background: rgba(37, 99, 235, 0.04);
}

/* --- Endpoint badges --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-ep-badge--kev,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-ep-badge--kev {
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.1);
    border-color: rgba(220, 38, 38, 0.2);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-ep-badge--crit,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-ep-badge--crit {
    color: #9a3412;
    background: rgba(234, 88, 12, 0.1);
    border-color: rgba(234, 88, 12, 0.2);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-ep-badge--high,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-ep-badge--high {
    color: #92400e;
    background: rgba(245, 158, 11, 0.1);
    border-color: rgba(245, 158, 11, 0.2);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-ep-badge--total,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-ep-badge--total {
    color: #475569;
    background: rgba(100, 116, 139, 0.08);
    border-color: rgba(100, 116, 139, 0.15);
}

/* --- Header context badge --- */
[data-theme="light"] #exposure-summary-page.expd-page .alerts-context-badge,
html[data-theme="light"] #exposure-summary-page.expd-page .alerts-context-badge {
    background: rgba(37, 99, 235, 0.05);
    border-color: rgba(37, 99, 235, 0.15);
    color: #475569;
}

[data-theme="light"] #exposure-summary-page.expd-page .context-highlight,
html[data-theme="light"] #exposure-summary-page.expd-page .context-highlight {
    color: #1e293b;
}

/* --- Refresh button --- */
[data-theme="light"] #exposure-summary-page.expd-page .expd-refresh--header,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-refresh--header {
    border-color: rgba(15, 23, 42, 0.12);
    background: rgba(241, 245, 249, 0.7);
    color: #475569;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-refresh--header:hover,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-refresh--header:hover {
    border-color: rgba(37, 99, 235, 0.3);
    background: rgba(37, 99, 235, 0.06);
    color: #2563eb;
}

/* --- Card loading spinner (matching main dashboard) --- */
#exposure-summary-page.expd-page .expd-card-spinner {
    text-align: center;
    margin-bottom: 10px;
}

#exposure-summary-page.expd-page .expd-card-spinner i {
    font-size: 28px;
    color: var(--expd-muted);
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-card-spinner i,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-card-spinner i {
    color: #94a3b8;
}

/* Panel-level spinner matching main dashboard overlay style */
#exposure-summary-page.expd-page .expd-panel-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    color: var(--expd-muted);
}

#exposure-summary-page.expd-page .expd-panel-loading i {
    font-size: 28px;
}

[data-theme="light"] #exposure-summary-page.expd-page .expd-panel-loading,
html[data-theme="light"] #exposure-summary-page.expd-page .expd-panel-loading {
    color: #94a3b8;
}