/* Clean CSS - Single ownership layout system */

/* Fix table-responsive conflicts - let DataTables control scrolling completely */
.table-responsive {
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

/* ✅ MOBILE OPTIMIZATION - only responsive breakpoints, no height control */
@media (max-width: 768px) {
    .metric-card {
        margin-bottom: 10px;
    }
}

/* ✅ FIXED - Prevent width recalculation jitter */
table.dataTable {
    width: 100% !important;
    /* ❌ REMOVED: table-layout: fixed;  - This was causing column squeeze */
}

table.dataTable td, 
table.dataTable th {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ✅ CRITICAL: Prevent data truncation in important financial columns */
table.dataTable td.important-col,
table.dataTable th.important-col {
    overflow: visible;
    text-overflow: clip;
}

/* 🚨 REMOVED: Mobile white-space normal was breaking data display */
/* @media (max-width: 768px) {
    table.dataTable td {
        white-space: normal;
    }
} */

/* ✅ ANTI-JITTER: Prevent micro layout shifts */
/* ❌ REMOVED: will-change: contents; - Causes GPU layer issues with DataTables */

/* ✅ FIXED - Signals summary layout fixes */
.signal-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: stretch;   /* ensures equal height */
}

/* ✅ FIXED: Use min-height instead of fixed height to prevent jitter */
.signal-summary .card {
    flex: 0 0 160px;        /* FIXED WIDTH (no stretch) */
    min-height: 90px;       /* prevents collapse during refresh */
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding: 10px;
}

/* Professional styling for dashboard look */
.signal-summary .card h5 {
    font-size: 14px;
    margin-bottom: 4px;
}

.signal-summary .card h3 {
    font-size: 18px;
    margin: 0;
}