form .aligned select option:checked {
  background-color: green;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  margin: 20px 0;
}
.stat-card {
  background: #f8f9fa;
  padding: 20px;
  border-radius: 8px;
  text-align: center;
  border: 1px solid #dee2e6;
}
.stat-number {
  font-size: 2em;
  font-weight: bold;
  color: #007bff;
}
.stat-label {
  color: #6c757d;
  margin-top: 5px;
}

.json-container {
  font-size: 12px;
}


/* Message styles - collapsible */

.messages-list {
  background-color: #f5f5f5;
  padding:5px 5px 10px 5px;
}

.messages-list strong {
padding:10px 5px;
}

.msg {
margin: 5px;
border: 1px solid #ddd;
overflow: hidden;
  background-color:white
}
.msg:last-child {
margin-bottom: 0;
}
.msg-header {
padding: 5px 10px;
font-size: 13px;
font-weight: 400;
cursor: pointer;
user-select: none;
border-bottom: 1px solid #ddd;
}
.msg-header a {
text-decoration: none;
color: inherit;
display: flex;
align-items: center;
}
.msg-header:hover {
background-color: rgba(0,0,0,0.02);
}
.msg-icon {
display: inline-block;
margin-right: 8px;
transition: transform 0.2s;
font-size: 10px;
}
.msg.collapsed .msg-icon {
transform: rotate(-90deg);
}
.msg-id {
font-size: 0.8em;
color: #999;
margin-left: 10px;
}
.msg-body {
padding: 10px;
display: block;
}
.msg.collapsed .msg-body {
display: none;
}
/* Colores por tipo de mensaje */
.msg-system {
border-color: #417690;
}
.msg-system .msg-header {
background-color: #e8f4f8;
color: #417690;
}
.msg-ai {
border-color: #ff9800;
}
.msg-ai .msg-header {
background-color: #fff3e0;
color: #ff9800;
}
.msg-tool {
border-color: #70bf2b;
}
.msg-tool .msg-header {
background-color: #f0f8e8;
color: #70bf2b;
}
.msg-human {
border-color: #9c27b0;
}
.msg-human .msg-header {
  background-color: #f3e5f5;
  color: #9c27b0;  
}
.msg-content {
white-space: pre-wrap;
word-wrap: break-word;
background: white;
padding: 1px;
}
.msg-metadata {
font-size: 0.9em;
color: #888;
margin-top: 10px;
}
.msg-metadata table {
width: 100%;
border-collapse: collapse;
}
.msg-metadata td {
padding: 4px 8px;
border-bottom: 1px solid #eee;
}
.msg-metadata td:first-child {
font-weight: bold;
width: 150px;
}


tr:nth-child(even)  {
  background: transparent;
}


.aligned label + p, .aligned .checkbox-row + div.help, .aligned label + div.readonly {
  padding: 5px 0;
}