:root {
    --sm-primary: #D63939;
}

/* Override "primary" in modo locale (senza toccare tutto il tema) */
.btn-primary {
    background-color: var(--sm-primary) !important;
    border-color: var(--sm-primary) !important;
}

.btn-primary:hover {
    filter: brightness(0.92);
}

.qr-shell {
    position: relative;
    width: 160px;
    height: 160px;
    border-radius: 2.5rem;
    display: grid;
    place-items: center;

    background: color-mix(in srgb, var(--sm-primary) 10%, transparent);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--sm-primary) 20%, transparent) inset;
    color: var(--sm-primary);
}

.qr-icon {
    font-size: 80px;
    line-height: 1;
}

.qr-corner {
    position: absolute;
    width: 24px;
    height: 24px;
}

.qr-corner.tl {
    top: -4px; left: -4px;
    border-left: 4px solid var(--sm-primary);
    border-top: 4px solid var(--sm-primary);
    border-top-left-radius: 0.75rem;
}

.qr-corner.tr {
    top: -4px; right: -4px;
    border-right: 4px solid var(--sm-primary);
    border-top: 4px solid var(--sm-primary);
    border-top-right-radius: 0.75rem;
}

.qr-corner.bl {
    bottom: -4px; left: -4px;
    border-left: 4px solid var(--sm-primary);
    border-bottom: 4px solid var(--sm-primary);
    border-bottom-left-radius: 0.75rem;
}

.qr-corner.br {
    bottom: -4px; right: -4px;
    border-right: 4px solid var(--sm-primary);
    border-bottom: 4px solid var(--sm-primary);
    border-bottom-right-radius: 0.75rem;
}
