/* My Vitals - Custom Styles */

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Data table */
.vitals-table {
    font-size: 0.8rem;
}
.vitals-table th {
    position: sticky;
    top: 0;
    z-index: 10;
}
.vitals-table td, .vitals-table th {
    white-space: nowrap;
    padding: 6px 10px;
}

/* Column toggle dropdown */
.col-toggle-dropdown {
    max-height: 300px;
    overflow-y: auto;
}

/* Chart container */
.chart-container {
    position: relative;
    width: 100%;
    min-height: 350px;
}

/* AI commentary */
.ai-commentary h1, .ai-commentary h2, .ai-commentary h3 {
    margin-top: 1em;
    margin-bottom: 0.5em;
    font-weight: 600;
}
.ai-commentary h2 { font-size: 1.15rem; }
.ai-commentary h3 { font-size: 1.05rem; }
.ai-commentary ul, .ai-commentary ol {
    margin-left: 1.5em;
    margin-bottom: 0.75em;
}
.ai-commentary li { margin-bottom: 0.3em; }
.ai-commentary p { margin-bottom: 0.75em; }
.ai-commentary strong { color: #1e40af; }

/* Scrollable table wrapper */
.table-wrapper {
    max-height: 500px;
    overflow: auto;
}

/* Token display */
.token-masked {
    font-family: monospace;
    word-break: break-all;
}

/* Loading spinner */
.spinner {
    border: 3px solid #e5e7eb;
    border-top: 3px solid #3b82f6;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    animation: spin 0.8s linear infinite;
    display: inline-block;
}
@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Metric multi-select chips */
.metric-chip {
    cursor: pointer;
    transition: all 0.15s;
}
.metric-chip:hover {
    opacity: 0.8;
}
.metric-chip.active {
    ring: 2px;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.5);
}

/* Responsive table */
@media (max-width: 768px) {
    .vitals-table { font-size: 0.7rem; }
    .vitals-table td, .vitals-table th { padding: 4px 6px; }
}