/* Buttons in the brand cyan (--color-primary: #009AD6)
   Overrides the theme's near-black hover fill, grey outline buttons and Bootstrap's blue focus states */

.tmp-btn.btn-primary,
.tmp-btn.btn-primary:focus,
.tmp-btn.btn-primary:active {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
    box-shadow: none;
}

.tmp-btn.btn-border {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.tmp-btn.btn-border:focus,
.tmp-btn.btn-border:active {
    box-shadow: none;
}

/* Hover fill that slides up from the bottom */
.tmp-btn.btn-primary::after,
.tmp-btn.btn-border::after {
    background: var(--primary-900);
}

.tmp-btn.btn-primary:focus-visible,
.tmp-btn.btn-border:focus-visible {
    outline: 2px solid var(--primary-300);
    outline-offset: 3px;
}