/* /Components/MyButton.razor.rz.scp.css */
/* Scoped to MyButton.razor — Blazor isolates these styles to this component. */

.my-button[b-noa2kzivl1] {
    display: inline-block;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 600;
    background: #D81B72;          /* brainzie brand magenta */
    color: #fff;
    padding: 12px 28px;
    border-radius: 8px;
    cursor: pointer;              /* hand cursor — signals "clickable" */
    user-select: none;            /* don't highlight the label on click */
    outline: none;                /* we replace the default focus ring below */
    box-shadow: 0 2px 6px rgba(216, 27, 114, 0.35);
    transition: background 0.15s, transform 0.1s, box-shadow 0.15s;
}

.my-button:hover[b-noa2kzivl1] {
    background: #A8155A;
    box-shadow: 0 4px 12px rgba(216, 27, 114, 0.45);
}

.my-button:active[b-noa2kzivl1] {
    background: #870f48;
    transform: scale(0.97);       /* the little "push" */
    box-shadow: none;
}

.my-button:focus-visible[b-noa2kzivl1] {
    /* Shown only for keyboard users — never remove this without a replacement. */
    outline: 3px solid #6D28D9;
    outline-offset: 3px;
}