/**
 * Hover-state utilities generated from the CSP Phase-5 migration:
 * inline onmouseover/onmouseout style-swap handlers became these
 * :hover classes (a strict CSP blocks inline handlers). !important
 * because the base styles live in inline style="..." attributes,
 * which would otherwise win over any class rule.
 */

.kbr-hover-1:hover {
    background: rgb(20 51 210 / 6%) !important;
}

.kbr-hover-2:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgb(20 51 210 / 50%) !important;
}

.kbr-hover-3:hover {
    background: var(--bg-hover) !important;
    color: var(--text-primary) !important;
}

.kbr-hover-4:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgb(20 51 210 / 40%) !important;
}

.kbr-hover-5:hover {
    background: var(--bg-hover) !important;
}

.kbr-hover-6:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgb(0 0 0 / 25%) !important;
}

.kbr-hover-7:hover {
    transform: scale(1.2) !important;
}

.kbr-hover-8:hover {
    background: rgb(239 68 68 / 8%) !important;
}

.kbr-hover-9:hover {
    transform: scale(1.15) !important;
}

.kbr-hover-10:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgb(0 0 0 / 10%) !important;
}

.kbr-hover-11:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgb(0 0 0 / 10%) !important;
}

.kbr-hover-12:hover {
    background: var(--bg-hover) !important;
    border-color: var(--brand-primary) !important;
    color: var(--brand-primary) !important;
}

.kbr-hover-13:hover {
    background: var(--bg-active) !important;
}

.kbr-hover-14:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgb(0 0 0 / 15%) !important;
}

.kbr-hover-15:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 2px 8px rgb(0 0 0 / 10%) !important;
}

.kbr-hover-16:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgb(0 0 0 / 25%) !important;
}

.kbr-hover-17:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgb(0 0 0 / 10%) !important;
}
