/* =====================================================
   Shared Buttons
   Colors From color.css
===================================================== */

.btn,
a.btn,
a.btn:link,
a.btn:visited,
input.btn,
button.btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    min-height: 44px;
    padding: 10px 18px !important;
    border: 1px solid transparent !important;
    border-radius: 12px !important;
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
    text-align: center !important;
    text-decoration: none !important;
    white-space: nowrap;
    cursor: pointer !important;
    box-sizing: border-box !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease, background-color 0.2s ease, border-color 0.2s ease !important;
}

/* =====================================================
   Primary
===================================================== */

.btn-primary,
a.btn-primary,
a.btn-primary:link,
a.btn-primary:visited,
input.btn-primary,
button.btn-primary {
    background: var(--primary) !important;
    color: var(--primary-text) !important;
    border-color: var(--primary) !important;
    box-shadow: 0 7px 18px rgba(0, 0, 0, 0.14);
}

/* =====================================================
   Secondary
===================================================== */

.btn-secondary,
a.btn-secondary,
a.btn-secondary:link,
a.btn-secondary:visited,
input.btn-secondary,
button.btn-secondary {
    background: var(--secondary) !important;
    color: var(--secondary-text) !important;
    border-color: var(--secondary) !important;
}

/* =====================================================
   Accent
===================================================== */

.btn-accent,
a.btn-accent,
a.btn-accent:link,
a.btn-accent:visited,
input.btn-accent,
button.btn-accent {
    background: var(--accent) !important;
    color: var(--accent-text) !important;
    border-color: var(--accent) !important;
}

/* =====================================================
   Success
===================================================== */

.btn-success,
a.btn-success,
a.btn-success:link,
a.btn-success:visited,
input.btn-success,
button.btn-success {
    background: var(--success) !important;
    color: var(--white) !important;
    border-color: var(--success) !important;
}

/* =====================================================
   Danger
===================================================== */

.btn-danger,
a.btn-danger,
a.btn-danger:link,
a.btn-danger:visited,
input.btn-danger,
button.btn-danger {
    background: var(--danger) !important;
    color: var(--white) !important;
    border-color: var(--danger) !important;
}

/* =====================================================
   Warning
===================================================== */

.btn-warning,
a.btn-warning,
a.btn-warning:link,
a.btn-warning:visited,
input.btn-warning,
button.btn-warning {
    background: var(--warning) !important;
    color: var(--black) !important;
    border-color: var(--warning) !important;
}

/* =====================================================
   Info
===================================================== */

.btn-info,
a.btn-info,
a.btn-info:link,
a.btn-info:visited,
input.btn-info,
button.btn-info {
    background: var(--info) !important;
    color: var(--white) !important;
    border-color: var(--info) !important;
}

/* =====================================================
   Light / Surface
===================================================== */

.btn-light,
a.btn-light,
a.btn-light:link,
a.btn-light:visited,
input.btn-light,
button.btn-light {
    background: var(--surface) !important;
    color: var(--surface-text) !important;
    border-color: var(--surface-border) !important;
}

/* =====================================================
   Outline
===================================================== */

.btn-outline,
a.btn-outline,
a.btn-outline:link,
a.btn-outline:visited,
input.btn-outline,
button.btn-outline {
    background: transparent !important;
    color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* =====================================================
   Disabled
===================================================== */

.btn:disabled,
.btn[disabled],
.btn.is-disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
    pointer-events: none;
}

/* =====================================================
   Hover
===================================================== */

.btn:not(:disabled):hover,
a.btn:hover,
input.btn:not(:disabled):hover,
button.btn:not(:disabled):hover {
    transform: translateY(-2px);
    opacity: 0.92 !important;
    text-decoration: none !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.18);
}

/* =====================================================
   Active
===================================================== */

.btn:not(:disabled):active,
a.btn:active,
input.btn:not(:disabled):active,
button.btn:not(:disabled):active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}

/* =====================================================
   Button Sizes
===================================================== */
.btn-sm {
    min-height: 36px;
    padding: 7px 12px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
}

.btn-lg {
    min-height: 52px;
    padding: 13px 24px !important;
    border-radius: 14px !important;
    font-size: 16px !important;
}

.btn-block {
    width: 100% !important;
}
/* =====================================================
   User Buttons
===================================================== */

.btn-user {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
    cursor: pointer;
    user-select: none;
}
.user-analysis-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
    cursor: pointer;
    user-select: none;
}
.user-analysis-submit {
    text-decoration: none;
}

    .user-analysis-submit,
    .user-analysis-submit:hover,
    .user-analysis-submit:focus,
    .user-analysis-submit:active {
        text-decoration: none;
    }