/* The base rows take the keypad's smaller corners; inside a group, Bootstrap still squares the joins */
.pc-base {
    --bs-border-radius: var(--bs-border-radius-sm);
    min-width: 0;
}

.pc-base-label {
    cursor: pointer;
}

.pc-bit {
    border: 0;
    border-radius: 0.25rem;
    background: transparent;
    color: inherit;
    font-size: 1rem;
}

.pc-bit:hover {
    background-color: var(--ck-surface-2);
}

.pc-bit:focus-visible {
    outline: 2px solid var(--ck-accent);
    outline-offset: -2px;
}

.pc-bit[aria-pressed="true"] {
    color: var(--ck-accent);
    font-weight: 700;
}

.pc-bit:disabled {
    opacity: 0.2;
}

.pc-bit-position {
    font-size: 0.7rem;
}