/* rev. 42 — bloque <style> de SmartProfit/Components/ModalAnalisisIA.razor (Mono web), verbatim. */
    /* ── IA Tabs ─────────────────────────────────────────────── */
    .ia-tabs {
        border-bottom: 1px solid #DDE3EE;
        display: flex;
    }

    .ia-tab {
        padding: 11px 20px;
        font-size: 12px;
        font-weight: 600;
        cursor: pointer;
        border-bottom: 2.5px solid transparent;
        color: #6B7A99;
        display: flex;
        align-items: center;
        gap: 7px;
        transition: color .2s, border-color .2s;
        background: none;
        border-top: none;
        border-left: none;
        border-right: none;
    }

        .ia-tab:hover {
            color: #0D3B6E;
        }

        .ia-tab.active {
            color: #0D3B6E;
            border-bottom-color: #0D3B6E;
        }

    .ia-body {
        padding: 20px 22px;
    }

    /* ── IA Loading ──────────────────────────────────────────── */
    .ia-loading {
        text-align: center;
        padding: 32px;
        color: #6B7A99;
    }

    .ia-dots {
        display: flex;
        justify-content: center;
        gap: 6px;
        margin-bottom: 10px;
    }

    .ia-dot {
        width: 8px;
        height: 8px;
        background: #0D3B6E;
        border-radius: 50%;
        animation: dotBounce .9s ease-in-out infinite;
    }

        .ia-dot:nth-child(2) {
            animation-delay: .15s;
        }

        .ia-dot:nth-child(3) {
            animation-delay: .3s;
        }

    @keyframes dotBounce {
        0%, 100% {
            transform: translateY(0);
            opacity: .4
        }

        50% {
            transform: translateY(-6px);
            opacity: 1
        }
    }

    /* ── Diagnóstico ─────────────────────────────────────────── */
    .diag-item {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        padding: 14px 16px;
        border-radius: 8px;
        height: 100%;
        border: 1px solid #DDE3EE;
        background: #F7F9FC;
        transition: box-shadow .2s;
    }

        .diag-item:hover {
            box-shadow: 0 2px 8px rgba(13,59,110,.08);
        }

    .diag-score {
        width: 44px;
        height: 44px;
        border-radius: 10px;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 16px;
        font-weight: 800;
    }

        .diag-score.sc-high {
            background: #EDFAF6;
            color: #00A88C;
        }

        .diag-score.sc-mid {
            background: #FFF8E6;
            color: #C47B00;
        }

        .diag-score.sc-low {
            background: #FFF0F0;
            color: #E63946;
        }

    .diag-ttl {
        font-size: 13px;
        font-weight: 700;
        color: #1C2B45;
        margin-bottom: 3px;
    }

    .diag-txt {
        font-size: 12px;
        color: #6B7A99;
        line-height: 1.5;
    }

    .diag-conf {
        font-size: 10px;
        color: #6B7A99;
        margin-left: auto;
        white-space: nowrap;
    }

    .diag-acts {
        display: flex;
        gap: 6px;
        margin-top: 8px;
        flex-wrap: wrap;
    }

    .diag-btn {
        font-size: 11px;
        font-weight: 600;
        padding: 4px 10px;
        border-radius: 6px;
        border: 1px solid;
        cursor: pointer;
        transition: all .15s;
    }

        .diag-btn.primary {
            background: #0D3B6E;
            color: #fff;
            border-color: #0D3B6E;
        }

            .diag-btn.primary:hover {
                background: #1A5EA8;
            }

        .diag-btn.outline {
            background: transparent;
            color: #0D3B6E;
            border-color: #DDE3EE;
        }

            .diag-btn.outline:hover {
                background: #EEF2F7;
            }

    .ia-footer {
        margin-top: 12px;
        padding: 10px 14px;
        background: #EEF2F7;
        border-radius: 8px;
        font-size: 11px;
        color: #6B7A99;
        display: flex;
        gap: 8px;
        align-items: center;
    }

    /* ── Predicción ──────────────────────────────────────────── */
    .pred-card {
        border: 1px solid #DDE3EE;
        border-radius: 8px;
        overflow: hidden;
        background: #F7F9FC;
        height: 100%;
    }

    .pred-hdr {
        background: #EEF2F7;
        padding: 10px 14px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid #DDE3EE;
    }

    .pred-hdr-ttl {
        font-size: 12px;
        font-weight: 700;
        color: #1C2B45;
        display: flex;
        align-items: center;
        gap: 7px;
    }

    .pred-horizon {
        font-size: 10px;
        background: #E8F0FE;
        color: #1A56C8;
        border-radius: 4px;
        padding: 2px 8px;
        font-weight: 600;
    }

    .pred-body {
        padding: 14px;
    }

    .pred-metrics {
        display: flex;
        gap: 10px;
        margin-bottom: 10px;
    }

    .pred-metric {
        flex: 1;
        text-align: center;
        background: #fff;
        border: 1px solid #DDE3EE;
        border-radius: 8px;
        padding: 10px;
    }

    .pred-metric-lbl {
        font-size: 10px;
        color: #6B7A99;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: .05em;
    }

    .pred-metric-val {
        font-size: 18px;
        font-weight: 800;
        color: #0D3B6E;
        margin: 4px 0 2px;
    }

    .pred-delta {
        font-size: 11px;
    }

        .pred-delta.up {
            color: #00A88C;
        }

        .pred-delta.down {
            color: #E63946;
        }

        .pred-delta.neutral {
            color: #6B7A99;
        }

    .pred-confband {
        font-size: 11px;
        color: #6B7A99;
        padding: 8px 10px;
        background: #fff;
        border-radius: 6px;
        border: 1px solid #DDE3EE;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .pred-bar-track {
        height: 6px;
        background: #EEF2F7;
        border-radius: 3px;
        flex: 1;
        overflow: hidden;
    }

    .pred-bar-fill {
        height: 100%;
        border-radius: 3px;
        background: linear-gradient(90deg, #0D3B6E, #00C9A7);
    }

    .pred-reco {
        margin-top: 8px;
        font-size: 11px;
        color: #6B7A99;
        line-height: 1.5;
        display: flex;
        gap: 6px;
        align-items: flex-start;
    }

    /* ── Anomalías ───────────────────────────────────────────── */
    .anomaly-card {
        border-radius: 8px;
        border: 1px solid;
        padding: 12px 14px 12px 18px;
        margin-bottom: 10px;
        position: relative;
        overflow: hidden;
    }

        .anomaly-card.critical {
            border-color: #FFCDD0;
            background: #FFF5F5;
        }

        .anomaly-card.medium {
            border-color: #FFE0A0;
            background: #FFFBF0;
        }

        .anomaly-card.low {
            border-color: #C0D4FF;
            background: #F0F5FF;
        }

        .anomaly-card::before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 4px;
        }

        .anomaly-card.critical::before {
            background: #E63946;
        }

        .anomaly-card.medium::before {
            background: #F4A623;
        }

        .anomaly-card.low::before {
            background: #4A80F5;
        }

    .anomaly-hdr {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 6px;
    }

    .anomaly-badge {
        font-size: 10px;
        font-weight: 700;
        padding: 2px 8px;
        border-radius: 4px;
        text-transform: uppercase;
        letter-spacing: .06em;
    }

    .anomaly-card.critical .anomaly-badge {
        background: #FFCDD0;
        color: #9B1A22;
    }

    .anomaly-card.medium .anomaly-badge {
        background: #FFE0A0;
        color: #8A5000;
    }

    .anomaly-card.low .anomaly-badge {
        background: #C0D4FF;
        color: #1A3A8A;
    }

    .anomaly-prod {
        font-size: 13px;
        font-weight: 700;
        color: #1C2B45;
    }

    .anomaly-dev {
        margin-left: auto;
        font-size: 18px;
        font-weight: 800;
    }

    .anomaly-card.critical .anomaly-dev {
        color: #E63946;
    }

    .anomaly-card.medium .anomaly-dev {
        color: #C47B00;
    }

    .anomaly-card.low .anomaly-dev {
        color: #1A56C8;
    }

    .anomaly-desc {
        font-size: 11px;
        color: #6B7A99;
        line-height: 1.5;
    }

    .anomaly-chips {
        display: flex;
        gap: 8px;
        margin-top: 8px;
        flex-wrap: wrap;
    }

    .anomaly-chip {
        font-size: 10px;
        background: rgba(0,0,0,.05);
        border-radius: 4px;
        padding: 2px 8px;
        color: #6B7A99;
        font-weight: 600;
    }

    .anomaly-toolbar {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 14px;
        flex-wrap: wrap;
    }

    .anomaly-toolbar-title {
        font-size: 13px;
        font-weight: 700;
        color: #1C2B45;
    }

    .anomaly-toolbar-sub {
        font-size: 11px;
        color: #6B7A99;
    }
