/*
 * ============================================================
 * SPYQINEX SWISS DARK TECH DESIGN SYSTEM
 * Strict No-Emoji Standard | Inter + JetBrains Mono | Razor Borders
 * ============================================================
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&display=swap');

:root {
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'JetBrains Mono', 'SF Mono', Menlo, Consolas, monospace;

    /* Matte Dark Carbon Surfaces */
    --bg-main: #0a0d14;
    --bg-card: #131722;
    --bg-card-hover: #1a2030;
    --bg-header: #0f131c;
    --border: #23293a;
    --border-subtle: rgba(255, 255, 255, 0.08);
    --border-focus: #3b82f6;

    /* Typography Colors */
    --text-primary: #f3f4f6;
    --text-secondary: #9ca3af;
    --text-muted: #6b7280;

    /* Institutional Accents */
    --color-profit: #10b981;
    --color-profit-bg: rgba(16, 185, 129, 0.12);
    --color-loss: #ef4444;
    --color-loss-bg: rgba(239, 68, 68, 0.12);
    --color-accent: #3b82f6;
    --color-accent-bg: rgba(59, 130, 246, 0.12);
    --color-warning: #f59e0b;
    --color-warning-bg: rgba(245, 158, 11, 0.12);
}

/* Base resets */
body {
    font-family: var(--font-sans) !important;
    background-color: var(--bg-main);
    color: var(--text-primary);
    -webkit-font-smoothing: antialiased;
}

/* Numeric & Code elements strictly monospace with tabular numbers */
.mono-val, .table-mono, .strike-val, .pnl-val, .ticker-val, td.mono,
.perf-table td:nth-child(1),
.perf-table td:nth-child(2),
.perf-table td:nth-child(4),
.perf-table td:nth-child(6),
.perf-table td:nth-child(7),
.perf-table td:nth-child(8),
.perf-table td:nth-child(9),
.perf-metric-value,
.header-stat-value {
    font-family: var(--font-mono) !important;
    font-feature-settings: "tnum" 1, "zero" 1;
    letter-spacing: -0.2px;
}

/* Precision Badges (Replacing Raw Emojis) */
.sqn-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 2px 7px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    border: 1px solid transparent;
}
.sqn-badge-profit { background: var(--color-profit-bg); color: var(--color-profit); border-color: rgba(16, 185, 129, 0.3); }
.sqn-badge-loss   { background: var(--color-loss-bg);   color: var(--color-loss);   border-color: rgba(239, 68, 68, 0.3); }
.sqn-badge-accent { background: var(--color-accent-bg); color: var(--color-accent); border-color: rgba(59, 130, 246, 0.3); }
.sqn-badge-neutral{ background: rgba(107, 114, 128, 0.15); color: var(--text-secondary); border-color: #374151; }

/* Header Mute Button Styling */
.sqn-mute-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: #1e2433;
    border: 1px solid #333d52;
    color: #e2e8f0;
    padding: 6px 12px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    transition: all 0.15s ease;
}
.sqn-mute-btn:hover {
    background: #2a3346;
    border-color: #4a5568;
}
.sqn-mute-btn.is-muted {
    background: rgba(239, 68, 68, 0.15);
    border-color: rgba(239, 68, 68, 0.5);
    color: #ef4444;
}

/* Zero-Flicker Status Pill */
.sqn-sync-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    padding: 3px 10px;
    border-radius: 12px;
    background: rgba(16, 185, 129, 0.08);
    border: 1px solid rgba(16, 185, 129, 0.2);
    color: #10b981;
    font-family: var(--font-mono);
    font-weight: 600;
}

/* Eliminate Blurry Neon Glows */
.perf-card, .metric-card, .stat-card, .header-stat-item, .alert-box {
    box-shadow: none !important;
    text-shadow: none !important;
    border: 1px solid var(--border) !important;
}

/* Smooth Table Row Transitions Without Layout Shifts */
.perf-table tr {
    transition: background-color 0.15s ease;
}
.perf-table tr:hover {
    background-color: rgba(255, 255, 255, 0.03);
}
