/* Add any pattern editor specific styles here */
.pattern-details {
    margin-top: 20px;
}

#patternGrid {
    display: grid;
    grid-template-columns: repeat(5, 1fr); /* 5 columns */
    grid-gap: 5px;
    margin-top: 10px;
}

.pattern-row {
    display: flex;
}

.grid-header {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    font-weight: bold;
    margin-bottom: 5px;
}

.pattern-cell {
    padding: 10px;
    border: 1px solid #ccc;
    text-align: center;
    cursor: pointer;
}

/* Tap Button Styling */
#tapButton {
    user-select: none; /* Prevent text selection while tapping rapidly */
    -webkit-user-select: none;
    transition: transform 0.05s, background-color 0.2s;
}

#tapButton:active {
    transform: scale(0.95);
}