@import 'SardauScore.Blazor.Common/SardauScore.Blazor.Common.8nnp8fm32a.bundle.scp.css';
@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.25o87uqmvr.bundle.scp.css';

/* _content/SardauScore.Blazor.Server/Components/Shared/BoardTiles.razor.rz.scp.css */


.tile[b-te4u34vsv7] {
    display: flex;
    align-items: center;
    background-color: #2d2d2d;
    border-radius: 1dvw;
    padding: 1.5dvw;
    box-shadow: 0 0.3dvw 0.6dvw rgba(0, 0, 0, 0.3);
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    color: #e0e0e0;
    border: 1px solid #404040; /* 1px border matching site's form control border */
    overflow: hidden;
    flex-direction: row;
    justify-content: flex-start;
    width: 80%;
    margin:2dvh;
    padding:1dvh;
}

.tile-content[b-te4u34vsv7] {
    align-items: center;
    margin: auto;
}
.tile:hover[b-te4u34vsv7] {
    transform: translateY(-0.3dvw);
    box-shadow: 0 0.5dvw 1dvw rgba(0, 0, 0, 0.3);
    background-color: #363636;
    border-color: #555555;
}

.tile.selected[b-te4u34vsv7] {
    background-color: #363636;
    border-color: #58a6ff;
    box-shadow: 0 0 0.6dvw rgba(85, 85, 85, 0.5), 0 0.5dvw 1dvw rgba(0, 0, 0, 0.3);
    transform: translateY(-0.3dvw);
    filter: drop-shadow(0 0 5px #58a6ff);
}

.tile-icon[b-te4u34vsv7] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tile-image[b-te4u34vsv7] {
    max-width: 100%;
    max-height: 15dvw;
    object-fit: contain;
}

.tile-qrcode[b-te4u34vsv7] {
    background-color: white;
    padding: 0.5dvw;
    border-radius: 1dvw;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
}

.tile-qrcode-image[b-te4u34vsv7] {
    max-width: 100%;
    max-height: 20dvw;
    object-fit: contain;
}

.tile-label[b-te4u34vsv7] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3dvw;
    font-weight: 500;
    text-align: center;
    word-break: break-word;
    color: #ffffff;
}
/* _content/SardauScore.Blazor.Server/Components/Shared/PageInstruction.razor.rz.scp.css */
.page-instruction[b-ifpfp27hrf] {
    width: 100%;
    color: #888888;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: max(14pt , 4dvh);
}
/* _content/SardauScore.Blazor.Server/Components/Shared/Tile.razor.rz.scp.css */


.tile[b-fuzy8oxq3n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: 17dvw;
    height: 17dvw;
    background-color: #2d2d2d;
    border-radius: 1dvw;
    padding: 1.5dvw;
    box-shadow: 0 0.3dvw 0.6dvw rgba(0, 0, 0, 0.3);
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    color: #e0e0e0;
    border: 1px solid #404040; /* 1px border matching site's form control border */
    overflow: hidden;
}
.tile-content[b-fuzy8oxq3n] {
    align-items: center;
    margin:auto;
  
}
.tile-wide[b-fuzy8oxq3n] {
    flex-direction: row;
    justify-content: flex-start;
    width:  33dvw;
    height: 18dvw;
}
    .tile-wide  .tile-image[b-fuzy8oxq3n] {
        max-height: 10dvw;
    }
    .tile-wide .tile-label[b-fuzy8oxq3n] {
        font-size: 2dvw;
    }
    .tile-wide .tile-qrcode-image[b-fuzy8oxq3n] {
        max-height: 14dvw;
    }

.tile:hover[b-fuzy8oxq3n] {
    transform: translateY(-0.3dvw);
    box-shadow: 0 0.5dvw 1dvw rgba(0, 0, 0, 0.3);
    background-color: #363636;
    border-color: #555555;
}

    .tile.selected[b-fuzy8oxq3n] {
        background-color: #363636;
        border-color: #58a6ff;
        box-shadow: 0 0 0.6dvw rgba(85, 85, 85, 0.5), 0 0.5dvw 1dvw rgba(0, 0, 0, 0.3);
        transform: translateY(-0.3dvw);
        filter: drop-shadow(0 0 5px #58a6ff);
    }

.tile-icon[b-fuzy8oxq3n] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tile-image[b-fuzy8oxq3n] {
    max-width: 100%;
    max-height: 8dvw;
    object-fit: contain;
}
.tile-qrcode[b-fuzy8oxq3n] {
    background-color: white;
    padding: 1dvw;
    border-radius: 1.5dvw;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
}
.tile-qrcode-image[b-fuzy8oxq3n] {
    max-width: 100%;
    max-height: 16dvw;
    object-fit: contain;
}

.tile-label[b-fuzy8oxq3n] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5dvw;
    font-weight: 500;
    text-align: center;
    word-break: break-word;
    color: #ffffff;
}
/* _content/SardauScore.Blazor.Server/Components/Shared/Tiles.razor.rz.scp.css */
.tiles-container[b-shu24hmgfd] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    justify-content: flex-start;
    padding: 1.5rem;
    width: 100%;
    background-color: #1a1a1a;
}

.tile-link[b-shu24hmgfd] {
    text-decoration: none;
    color: inherit;
    flex-grow: 0;
    margin-bottom: 0.5rem;
    border-radius: 15px;
    display: block; /* Ensure the anchor doesn't interfere with the tile's styling */
}

/* Remove max-width constraints as we're using fixed size tiles */
@media (max-width: 992px) {
    .tiles-container[b-shu24hmgfd] {
        gap: 1rem;
    }
}

@media (max-width: 768px) {
    .tiles-container[b-shu24hmgfd] {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .tiles-container[b-shu24hmgfd] {
        padding: 1rem;
    }
}