.match-row {
    overflow-x: hidden;
}

.match-grid {
    display: grid;
    grid-template-columns: 50px 200px 75px;
    align-items: center;
    /*gap: 0.5rem;*/
    /*min-width: 600px;*/
}
/*
.match-date {
    position: sticky;
    left: 0;
    background: white;
    z-index: 2;
    padding-right: 0.5rem;*/
    /*background-color: cyan;*/
/*}

.match-teams {
    position: sticky;
    left: 60px;*/ /* afhankelijk van datumbreedte */
    /*background: white;
    z-index: 2;*/
    /*background-color: yellow;*/
/*}

.match-score {*/
    /*justify-self: end;*/
    /*background-color: hotpink;*/
/*}
*/
.score-field {
    text-align: center;
    /*vertical-align: central;*/
    /*background-color: lightgray;*/
    border-style: solid;
    border-width: 1px;
    border-color: darkgray;
}

.numeric-container {
    text-align: center;
    /*vertical-align: central;*/
    /*background-color: lightgray;*/
    align-content:center;
    align-items:center;
    border-style: solid;
    border-width: 1px;
    border-color: darkgray;
}

.align-right input {
    text-align: right;
}

.align-input-center input {
    text-align: center;
}

/* Dark mode support for score fields */
@media (prefers-color-scheme: dark) {
    .score-field,
    .numeric-container {
        border-color: rgba(255, 255, 255, 0.23);
    }

    .score-field input,
    .numeric-container input {
        color: rgba(255, 255, 255, 0.87);
    }
}

/* MudBlazor dark mode toggle support */
.dark-mode .score-field,
.dark-mode .numeric-container {
    border-color: rgba(255, 255, 255, 0.23) !important;
}

.dark-mode .score-field input,
.dark-mode .numeric-container input {
    color: rgba(255, 255, 255, 0.87) !important;
}