/* Agent Decision History Styles */

/* Variable Mapping */
:root {
    --ad-bg: var(--bg-color);
    --ad-card-bg: var(--card-bg);
    --ad-text: var(--text-color);
    --ad-text-muted: gray;
    --ad-border: var(--ui-border-color);
    --ad-accent: var(--accent);
    --ad-stat-box-bg: var(--container-bg-1); /* Use container background for stat boxes */
}

[data-theme="dark"] {
    --ad-text-muted: #adb5bd;
    --ad-stat-box-bg: #2c2c2c; /* Slightly lighter than pure black/dark bg */
}

/* Scoped Container */
.agent-decision-container {
    color: var(--ad-text);
}

/* Card Overrides within Container */
.agent-decision-container .card {
    background-color: var(--ad-card-bg);
    border-color: var(--ad-border);
    color: var(--ad-text);
}

.agent-decision-container .card-header {
    background-color: var(--header-bg-color); 
    border-bottom-color: var(--ad-border);
    color: var(--ad-text);
}

/* Stat Box */
.agent-decision-container .stat-box {
    padding: 15px;
    background: var(--ad-stat-box-bg);
    border-radius: 5px;
    text-align: center;
    border-left: 4px solid var(--ad-accent);
    margin-bottom: 15px;
}

.agent-decision-container .stat-box h6 {
    color: var(--ad-text);
    opacity: 0.8;
    font-size: 14px;
    margin-bottom: 10px;
}

.agent-decision-container .stat-value {
    font-size: 24px;
    font-weight: bold;
    color: var(--ad-accent);
    margin: 0;
}

/* Agent selector */
.agent-selector {
    width: 300px;
    background-color: var(--container-bg-2);
    color: var(--ad-text);
    border: 1px solid var(--ad-border);
}

/* Table Overrides */
.agent-decision-container .table {
    color: var(--ad-text);
}

.agent-decision-container .thead-light th {
    background-color: var(--header-bg-color);
    border-color: var(--ad-border);
    color: var(--ad-text);
}

.agent-decision-container .table-hover tbody tr:hover {
    background-color: rgba(0,0,0,0.05);
}

[data-theme="dark"] .agent-decision-container .table-hover tbody tr:hover {
    background-color: rgba(255,255,255,0.05);
}
