/* =========================================================
   STATBASKET CONSOLE PRO
   READ-ONLY DASHBOARD V1
   ========================================================= */

#sbProDashboard{
    width:calc(100% - 32px);
    max-width:1380px;

    margin:12px auto 24px;

    border:1px solid #263440;
    border-radius:8px;

    background:#0e161f;

    color:#eef2f6;

    overflow:hidden;
}


/* =========================================================
   TAB BAR
   ========================================================= */

.sbpro-tabs{
    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    border-bottom:1px solid #263440;

    background:#101923;
}

.sbpro-tab{
    min-height:43px;

    padding:8px 10px;

    border:0;
    border-right:1px solid #202d39;

    background:transparent;

    color:#8e9cab;

    font-size:10px;
    font-weight:850;

    letter-spacing:.5px;

    cursor:pointer;

    text-transform:uppercase;
}

.sbpro-tab:last-child{
    border-right:0;
}

.sbpro-tab.active{
    color:#f3f6f9;

    background:#151f2a;

    box-shadow:
        inset 0 -2px #3b82f6;
}


/* =========================================================
   BODY
   ========================================================= */

.sbpro-body{
    min-height:210px;

    padding:12px;

    background:#0d151e;
}

.sbpro-loading,
.sbpro-empty,
.sbpro-error{
    min-height:170px;

    display:flex;

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

    color:#7f8c9b;

    font-size:11px;
}

.sbpro-error{
    color:#d69c9c;
}


/* =========================================================
   TWO TEAMS
   ========================================================= */

.sbpro-teams{
    display:grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:10px;
}

.sbpro-card{
    min-width:0;

    border:1px solid #25323e;
    border-radius:7px;

    background:#101922;

    overflow:hidden;
}

.sbpro-card-title{
    padding:8px 10px;

    border-bottom:1px solid #222f3a;

    color:#c7d0d9;

    font-size:11px;
    font-weight:900;
}

.sbpro-card-title.home{
    color:#75a8ee;
}

.sbpro-card-title.away{
    color:#e27777;
}


/* =========================================================
   TABLE
   ========================================================= */

.sbpro-table-wrap{
    width:100%;

    overflow:auto;
}

.sbpro-table{
    width:100%;

    border-collapse:collapse;

    font-size:10px;

    white-space:nowrap;
}

.sbpro-table th{
    padding:7px 6px;

    border-bottom:1px solid #26333f;

    color:#758394;

    font-size:8px;
    font-weight:850;

    text-transform:uppercase;

    text-align:right;
}

.sbpro-table th:nth-child(1),
.sbpro-table th:nth-child(2){
    text-align:left;
}

.sbpro-table td{
    padding:7px 6px;

    border-bottom:1px solid #1c2732;

    color:#d7dee5;

    text-align:right;
}

.sbpro-table td:nth-child(1),
.sbpro-table td:nth-child(2){
    text-align:left;
}

.sbpro-table tbody tr:last-child td{
    border-bottom:0;
}

.sbpro-number{
    color:#8291a1;
}

.sbpro-player{
    font-weight:750;
}


/* =========================================================
   PLAY BY PLAY
   ========================================================= */

.sbpro-pbp{
    display:flex;

    flex-direction:column;

    gap:3px;
}

.sbpro-pbp-row{
    display:grid;

    grid-template-columns:
        55px
        55px
        minmax(180px,1fr)
        70px;

    align-items:center;

    min-height:35px;

    padding:5px 8px;

    border:1px solid #202d38;
    border-radius:5px;

    background:#101922;

    font-size:10px;
}

.sbpro-pbp-clock{
    color:#9aa8b7;

    font-variant-numeric:tabular-nums;
}

.sbpro-pbp-period{
    color:#718094;
}

.sbpro-pbp-action{
    color:#d9e0e7;
}

.sbpro-pbp-score{
    color:#f1f4f7;

    font-weight:900;

    text-align:right;

    font-variant-numeric:tabular-nums;
}

.sbpro-home{
    color:#69a3ed;
}

.sbpro-away{
    color:#e06f6f;
}


/* =========================================================
   TEAM STATS
   ========================================================= */

.sbpro-stat-grid{
    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:7px;

    padding:10px;
}

.sbpro-stat{
    min-height:66px;

    padding:8px;

    border:1px solid #25323e;
    border-radius:6px;

    background:#0d161f;

    display:flex;

    flex-direction:column;

    justify-content:center;
}

.sbpro-stat-label{
    color:#788697;

    font-size:8px;
    font-weight:800;

    text-transform:uppercase;
}

.sbpro-stat-value{
    margin-top:3px;

    color:#eef2f6;

    font-size:18px;
    font-weight:900;

    font-variant-numeric:tabular-nums;
}

.sbpro-stat-sub{
    margin-top:2px;

    color:#798696;

    font-size:8px;
}


/* =========================================================
   STATUS LINE
   ========================================================= */

.sbpro-footer{
    display:flex;

    justify-content:space-between;

    gap:10px;

    padding:6px 10px;

    border-top:1px solid #202d38;

    background:#0b131b;

    color:#667687;

    font-size:8px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:950px){

    .sbpro-stat-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .sbpro-teams{
        gap:6px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:760px){

    #sbProDashboard{
        width:calc(100% - 10px);

        margin-top:7px;
    }

    .sbpro-tabs{
        grid-template-columns:
            repeat(4,minmax(0,1fr));
    }

    .sbpro-tab{
        min-height:38px;

        padding:5px 2px;

        font-size:7px;
    }

    .sbpro-body{
        padding:6px;
    }

    .sbpro-teams{
        grid-template-columns:1fr;

        gap:6px;
    }

    .sbpro-card-title{
        padding:6px 7px;

        font-size:9px;
    }

    .sbpro-table{
        font-size:8px;
    }

    .sbpro-table th{
        padding:5px 4px;

        font-size:6px;
    }

    .sbpro-table td{
        padding:6px 4px;
    }

    .sbpro-pbp-row{
        grid-template-columns:
            38px
            30px
            minmax(130px,1fr)
            48px;

        min-height:31px;

        padding:4px 5px;

        font-size:8px;
    }

    .sbpro-stat-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:4px;

        padding:6px;
    }

    .sbpro-stat{
        min-height:55px;

        padding:6px;
    }

    .sbpro-stat-label{
        font-size:6px;
    }

    .sbpro-stat-value{
        font-size:15px;
    }

    .sbpro-stat-sub{
        font-size:6px;
    }
}