/* AIリスク表示 UI */

.ai-venue-badge {
    display: inline-flex;
    align-items: center;
    margin-left: 7px;
    padding: 2px 7px;
    border-radius: 999px;
    background: #eef2ff;
    color: #3730a3;
    border: 1px solid #c7d2fe;
    font-size: 0.74rem;
    font-weight: 800;
    line-height: 1.25;
    white-space: nowrap;
}

.ai-risk-inline-badge {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #be123c;
    color: #fff;
    font-size: 0.74rem;
    font-weight: 900;
    line-height: 1.25;
    white-space: nowrap;
}

.ai-avoid-card {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 6px;
}

.ai-avoid-card-label,
.ai-race-avoid-badge,
.ai-race-avoid-badge-js {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    margin-left: 8px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #be123c;
    color: #fff;
    font-size: 0.74rem;
    font-weight: 900;
    line-height: 1.25;
    white-space: nowrap;
}

.ai-avoid-card-text {
    display: none;
}

.ai-avoid-panel {
    margin: 12px 0 14px;
    padding: 12px 14px;
    border-radius: 14px;
    background: #fff1f2;
    border: 1px solid #fecdd3;
    border-left: 5px solid #be123c;
}

.ai-avoid-panel-title {
    color: #9f1239;
    font-size: 1rem;
    font-weight: 900;
    margin-bottom: 4px;
}

.ai-avoid-panel-text {
    color: #881337;
    font-size: 0.9rem;
    line-height: 1.6;
}

.ai-avoid-table-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    border-radius: 999px;
    background: #ffe4e6;
    color: #9f1239;
    border: 1px solid #fecdd3;
    font-size: 0.76rem;
    font-weight: 900;
    white-space: nowrap;
}

.ai-avoid-table-empty {
    color: #cbd5e1;
}

.table-row-shadow-avoid {
    background: #fff1f2;
}

.table-row-shadow-avoid td {
    border-bottom-color: #fecdd3 !important;
}

.ai-race-avoid-row {
    background: linear-gradient(90deg, #fff1f2 0%, rgba(255,255,255,0) 85%);
}

.ai-race-avoid-row td {
    border-bottom-color: #fecdd3 !important;
}

.ai-race-avoid-note {
    display: block;
    margin-top: 4px;
    color: #9f1239;
    font-size: 0.76rem;
    font-weight: 800;
}

@media (max-width: 720px) {
    .ai-venue-badge,
    .ai-risk-inline-badge,
    .ai-race-avoid-badge,
    .ai-race-avoid-badge-js {
        margin-left: 4px;
        margin-top: 3px;
    }
}

/* 候補カード上部の配置調整 */
.card-top {
    gap: 6px;
}

.card-top .horse-no {
    white-space: nowrap;
}

.card-top .ai-risk-inline-badge {
    margin-left: 0;
    flex: 0 0 auto;
}

.card-top .trigger {
    margin-left: auto;
}

/* リスク高 + 警戒度 表示 */
.ai-risk-inline-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 6px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #be123c;
    color: #fff;
    font-size: 0.74rem;
    font-weight: 900;
    line-height: 1.25;
    white-space: nowrap;
}

.ai-risk-inline-badge .ai-risk-main {
    color: #fff;
}

.ai-risk-inline-badge .ai-risk-score {
    padding-left: 6px;
    border-left: 1px solid rgba(255,255,255,0.38);
    color: #ffe4e6;
    font-weight: 800;
}

.ai-avoid-table-badge {
    gap: 3px;
}

.ai-avoid-table-badge small {
    display: block;
    color: #9f1239;
    font-size: 0.68rem;
    font-weight: 800;
}

/* レース一覧の警戒度説明 */
.ai-risk-list-help {
    margin: -4px 0 12px;
    color: #64748b;
    font-size: 0.84rem;
    line-height: 1.6;
}

/* レース一覧では「リスク高」ではなく警戒度だけを見せる */
.ai-race-avoid-badge-js {
    background: #f1f5f9;
    color: #9f1239;
    border: 1px solid #fecdd3;
    font-weight: 900;
}

/* レース一覧の警戒度説明文 */
.ai-risk-list-help {
    margin: -2px 0 12px;
    padding: 8px 10px;
    border-left: 4px solid #cbd5e1;
    background: #f8fafc;
    color: #475569;
    font-size: 0.82rem;
    line-height: 1.55;
    border-radius: 8px;
}

/* Hide AI risk badge on place cards */
.ai-risk-inline-badge,
.ai-risk-main,
.ai-risk-score {
    display: none !important;
}

/* Show warning score only. Hide only the "リスク高" text. */
.ai-risk-inline-badge {
    display: inline-flex !important;
}

.ai-risk-inline-badge .ai-risk-score,
.ai-risk-score {
    display: inline-block !important;
}

.ai-risk-inline-badge .ai-risk-main,
.ai-risk-main {
    display: none !important;
}