/* Shared by the tools that analyse a home/away team pair: Form Analyzer and Corners & Cards.
   Team pickers (_TeamPairPicker partial) plus the prediction card, 1X2 bar and stats list. */

.card:has(.team-search-results) { overflow: visible; position: relative; z-index: 10; }
.team-search-results {
    position: absolute; top: 100%; left: 0; right: 0; background: #0d0f16; border: 1px solid #223150;
    border-radius: 8px; max-height: 250px; overflow-y: auto; z-index: 1000; display: none;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}
.team-search-results.show { display: block; }
.team-result-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; cursor: pointer; border-bottom: 1px solid #1e2842; }
.team-result-item:hover { background: #1b2338; }
.team-result-item:last-child { border-bottom: none; }
.team-result-item img { width: 28px; height: 28px; object-fit: contain; }
.team-selected {
    display: flex; align-items: center; gap: 10px; padding: 8px 12px;
    background: linear-gradient(135deg, rgba(92, 210, 185, 0.1), rgba(128, 179, 255, 0.05));
    border: 1px solid var(--brand); border-radius: 8px;
}
.team-badge { width: 32px; height: 32px; object-fit: contain; }
.btn-clear { background: none; border: none; color: var(--muted); cursor: pointer; margin-left: auto; padding: 4px; }
.btn-clear:hover { color: var(--danger); }
.search-spinner {
    position: absolute; right: 12px; top: 50%; width: 18px; height: 18px; transform: translateY(-50%);
    border: 2px solid rgba(92, 210, 185, 0.2); border-top-color: var(--brand); border-radius: 50%;
    animation: fa-spin 0.6s linear infinite; pointer-events: none;
}
@keyframes fa-spin { to { transform: translateY(-50%) rotate(360deg); } }

.fa-prediction { background: linear-gradient(135deg, #0c101a 0%, #12182a 100%); border: 1px solid rgba(92, 210, 185, 0.2); }
.fa-team-logo { width: 64px; height: 64px; object-fit: contain; }
.fa-xg { font-size: 1.75rem; font-weight: 700; color: var(--brand); }
.fa-badge { font-size: 0.8rem; padding: 4px 10px; border-radius: 12px; background: rgba(234, 179, 8, 0.15); color: #eab308; }
.fa-1x2 { display: flex; height: 12px; border-radius: 6px; overflow: hidden; background: #1e2842; }
.fa-1x2-seg { height: 100%; transition: width 0.5s ease; }
.fa-seg-home { background: var(--brand); }
.fa-seg-draw { background: var(--muted); }
.fa-seg-away { background: var(--accent); }
.fa-stats { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; font-size: 0.9rem; }
.fa-stats dt { font-weight: 400; color: var(--muted); }
.fa-stats dd { margin: 0; font-weight: 600; text-align: right; }

@media (max-width: 768px) {
    .fa-team-logo { width: 44px; height: 44px; }
    .fa-xg { font-size: 1.35rem; }
}
