
/* =========================================================
   STATBASKET FOUL ALERT PRO V1
   ========================================================= */

.sb-foul-alert{
    position:fixed;
    inset:0;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:20px;

    background:
        rgba(6,12,24,.46);

    backdrop-filter:
        blur(5px);

    -webkit-backdrop-filter:
        blur(5px);

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    z-index:999999;

    transition:
        opacity .16s ease,
        visibility .16s ease;
}


.sb-foul-alert.show{
    opacity:1;
    visibility:visible;
}


.sb-foul-alert-card{

    width:min(
        460px,
        calc(100vw - 32px)
    );

    min-height:390px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    padding:
        34px
        28px
        30px;

    border-radius:24px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f7f9fc 100%
        );

    border:
        1px solid
        rgba(15,23,42,.12);

    box-shadow:
        0 30px 90px
        rgba(0,0,0,.38);

    color:#111827;

    text-align:center;

    transform:
        translateY(12px)
        scale(.96);

    transition:
        transform .18s ease;
}


.sb-foul-alert.show
.sb-foul-alert-card{

    transform:
        translateY(0)
        scale(1);
}


.sb-foul-alert-label{

    font-size:13px;

    font-weight:800;

    letter-spacing:.16em;

    color:#64748b;

    margin-bottom:18px;
}


.sb-foul-alert-player{

    font-size:
        clamp(
            54px,
            11vw,
            82px
        );

    line-height:.95;

    font-weight:900;

    letter-spacing:-.05em;

    color:#0f172a;
}


.sb-foul-alert-name{

    margin-top:12px;

    max-width:100%;

    font-size:
        clamp(
            18px,
            4vw,
            25px
        );

    font-weight:800;

    line-height:1.15;

    color:#334155;

    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}


.sb-foul-alert-count{

    margin-top:24px;

    font-size:
        clamp(
            88px,
            22vw,
            150px
        );

    line-height:.8;

    font-weight:950;

    letter-spacing:-.07em;

    color:#dc2626;
}


.sb-foul-alert-caption{

    margin-top:15px;

    font-size:18px;

    font-weight:900;

    letter-spacing:.16em;

    color:#475569;
}


.sb-foul-alert-limit{

    display:none;

    margin-top:20px;

    padding:
        10px
        18px;

    border-radius:999px;

    background:#dc2626;

    color:#fff;

    font-size:
        14px;

    font-weight:900;

    letter-spacing:.08em;
}


/* QUINTO FALLO */

.sb-foul-alert.foul-out
.sb-foul-alert-card{

    border:
        2px solid
        rgba(220,38,38,.60);

    box-shadow:
        0 30px 100px
        rgba(220,38,38,.25),
        0 30px 90px
        rgba(0,0,0,.38);
}


.sb-foul-alert.foul-out
.sb-foul-alert-limit{

    display:block;
}


/* MOBILE */

@media (max-width:600px){

    .sb-foul-alert{
        padding:14px;
    }

    .sb-foul-alert-card{

        width:100%;

        min-height:340px;

        padding:
            28px
            20px;

        border-radius:20px;
    }

    .sb-foul-alert-label{
        margin-bottom:15px;
    }

}


/* MOBILE ORIZZONTALE */

@media
(max-height:500px)
and
(orientation:landscape){

    .sb-foul-alert-card{

        min-height:0;

        max-height:
            calc(100vh - 20px);

        padding:
            18px
            26px;

        border-radius:18px;
    }

    .sb-foul-alert-label{
        margin-bottom:7px;
    }

    .sb-foul-alert-player{
        font-size:44px;
    }

    .sb-foul-alert-name{
        margin-top:5px;
        font-size:17px;
    }

    .sb-foul-alert-count{
        margin-top:10px;
        font-size:72px;
    }

    .sb-foul-alert-caption{
        margin-top:8px;
        font-size:14px;
    }

    .sb-foul-alert-limit{
        margin-top:10px;
        padding:7px 14px;
        font-size:12px;
    }

}

