/* Estilos exclusivos da aba Amigos e dos amistosos. */
.amigos-tab {
    min-width: 0;
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--club-primary, #0f9f6e) 72%, #000000) 0%,
        color-mix(in srgb, var(--club-primary, #0f9f6e) 42%, #000000) 24%,
        color-mix(in srgb, var(--club-primary, #0f9f6e) 18%, #000000) 68%,
        color-mix(in srgb, var(--club-primary, #0f9f6e) 6%, #000000) 100%);
}

.amigos-tab button,
.amigos-tab input,
.amigos-tab select {
    max-width: 100%;
}

.app-modal__box:has(.amistoso-challenge) {
    overflow: hidden;
    border-color: color-mix(in srgb, var(--club-primary, #0f9f6e) 45%, #3f3f46);
    background: #10151f;
}

.app-modal__box:has(.amistoso-challenge) .app-modal__header {
    background: #0b1018;
}

.amistoso-challenge__hero {
    position: relative;
    overflow: hidden;
    padding: 1.25rem;
    border: 1px solid color-mix(in srgb, var(--club-primary, #0f9f6e) 40%, transparent);
    border-radius: 1rem;
    background:
        radial-gradient(circle at 50% 15%, color-mix(in srgb, var(--club-primary, #0f9f6e) 28%, transparent), transparent 52%),
        linear-gradient(145deg, #172131, #090d14);
    text-align: center;
}

.amistoso-challenge__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: #fbbf24;
    font-size: .63rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.amistoso-challenge__versus {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin: .85rem 0 .65rem;
}

.amistoso-challenge__versus > strong {
    color: #f8fafc;
    font-size: 1rem;
    font-style: italic;
}

.amistoso-challenge__shield {
    display: grid;
    place-items: center;
    width: 3.25rem;
    height: 3.25rem;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 1rem;
    background: color-mix(in srgb, var(--club-primary, #0f9f6e) 24%, #101827);
    color: color-mix(in srgb, var(--club-primary, #0f9f6e) 65%, #fff);
    font-size: 1.4rem;
    transform: rotate(-5deg);
}

.amistoso-challenge__shield--rival {
    background: rgba(239, 68, 68, .13);
    color: #f87171;
    transform: rotate(5deg);
}

.amistoso-challenge__hero h3 {
    margin: 0;
    color: #fff;
    font-size: 1.25rem;
    font-weight: 900;
}

.amistoso-challenge__hero p {
    margin: .3rem 0 0;
    color: #a1a1aa;
    font-size: .72rem;
}

.amistoso-challenge__section {
    padding: .9rem;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: .85rem;
    background: rgba(9, 13, 20, .55);
}

.amistoso-challenge__section label i {
    margin-right: .35rem;
    color: #fbbf24;
}

.amistoso-challenge__section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.amistoso-challenge__section-head > span {
    color: #a1a1aa;
    font-size: .62rem;
}

.amistoso-challenge__bets {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .4rem;
}

.amistoso-challenge__bets button {
    min-width: 0;
    padding: .45rem .25rem;
    border: 1px solid #3f3f46;
    border-radius: .55rem;
    background: #18181b;
    color: #d4d4d8;
    font-size: .65rem;
    font-weight: 800;
}

.amistoso-challenge__bets button.is-active {
    border-color: var(--club-primary, #0f9f6e);
    background: color-mix(in srgb, var(--club-primary, #0f9f6e) 18%, #18181b);
    color: #fff;
}

.amistoso-challenge__bets button:disabled {
    opacity: .3;
}

.amistoso-challenge__submit i {
    margin-right: .35rem;
}