/* ============================================================
   Hubbe Registry — Button Styles
   All button overrides and custom button classes live here.
   Loaded after app.css, before component-scoped styles.
   ============================================================ */

/* ── Links & btn-link ── */
a, .btn-link {
    color: var(--color-primary);
}

/* ── Focus ring (all buttons + form controls) ── */
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem var(--hubbe-grapefruit-2);
}

/* ── Primary / Save / Submit (Grapefruit) ── */
.btn-primary {
    color: #fff;
    background-color: var(--color-primary);
    border-color: var(--color-primary-dark);
}

.btn-primary:hover {
    color: #fff;
    background-color: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
}

.btn-primary:disabled,
.btn-primary.disabled {
    background-color: var(--color-primary);
    border-color: var(--color-primary-dark);
    opacity: 0.65;
}

/* ── Outline Primary (Grapefruit outline → Grapefruit fill on hover) ── */
.btn-outline-primary {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn-outline-primary:hover {
    color: #fff;
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

/* ── Create / Add (Blue) ── */
.registry-btn-create {
    color: #fff;
    background-color: #0d6efd;
    border-color: #0b5ed7;
}

.registry-btn-create:hover {
    color: #fff;
    background-color: #0b5ed7;
    border-color: #0a58ca;
}

.registry-btn-create:disabled,
.registry-btn-create.disabled {
    background-color: #0d6efd;
    border-color: #0b5ed7;
    opacity: 0.65;
}

/* ── Outline Create (Blue outline → Blue fill on hover) ── */
.registry-btn-outline-create {
    color: #0d6efd;
    border-color: #0d6efd;
    background-color: transparent;
}

.registry-btn-outline-create:hover {
    color: #fff;
    background-color: #0d6efd;
    border-color: #0d6efd;
}

/* ── Secondary (Gray — explicit hover for consistency) ── */
.btn-secondary:hover {
    background-color: #5c636a;
    border-color: #565e64;
}

/* ── Danger / Delete (Red — explicit hover for consistency) ── */
.btn-danger:hover {
    background-color: #bb2d3b;
    border-color: #b02a37;
}

/* ── CTA Orange (Landing/Account pages) ── */
.registry-btn-cta-orange {
    color: #fff;
    background-color: var(--hubbe-orange);
    border-color: var(--hubbe-orange);
}

.registry-btn-cta-orange:hover {
    color: #fff;
    background-color: #D9911E;
    border-color: #D9911E;
}

.registry-btn-cta-orange:disabled,
.registry-btn-cta-orange.disabled {
    background-color: var(--hubbe-orange);
    border-color: var(--hubbe-orange);
    opacity: 0.65;
}

/* ── CTA Mint (Landing/Account pages) ── */
.registry-btn-cta-mint {
    color: #fff;
    background-color: var(--hubbe-mint);
    border-color: var(--hubbe-mint);
}

.registry-btn-cta-mint:hover {
    color: #fff;
    background-color: #6B877E;
    border-color: #6B877E;
}

.registry-btn-cta-mint:disabled,
.registry-btn-cta-mint.disabled {
    background-color: var(--hubbe-mint);
    border-color: var(--hubbe-mint);
    opacity: 0.65;
}

/* ── CTA Mustard (Landing/Account pages) ── */
.registry-btn-cta-mustard {
    color: #fff;
    background-color: var(--hubbe-mustard);
    border-color: var(--hubbe-mustard);
}

.registry-btn-cta-mustard:hover {
    color: #fff;
    background-color: #AD7625;
    border-color: #AD7625;
}

.registry-btn-cta-mustard:disabled,
.registry-btn-cta-mustard.disabled {
    background-color: var(--hubbe-mustard);
    border-color: var(--hubbe-mustard);
    opacity: 0.65;
}
