/**
 * buttons.css — All button variants: primary, secondary, outline,
 * danger, signed-up, outline-navy, edit, and delete.
 */

/* ── Button variants ── */
.btn-outline-navy {
    border-color: var(--color-navy);
    color: var(--color-navy);
    background: transparent;
}
/* ── Primary "navy" action button ── */
.btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-navy);
    color: var(--color-surface);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    padding: 0.375rem 0.75rem;
    white-space: nowrap;
    border: none;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: background-color 0.15s;
}

.btn-primary:hover {
    background-color: var(--color-navy-dark);
}
.btn-primary:disabled {
    background-color: var(--color-gray-400);
    cursor: default;
}

/* ── Secondary neutral button ── */
.btn-secondary {
    background-color: var(--color-gray-600);
    color: var(--color-surface);
    font-weight: 600;
    border: none;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: background-color 0.15s;
}

.btn-secondary:hover {
    background-color: var(--color-gray-500);
}

/* ── Outline button ── */
.btn-outline {
    background-color: transparent;
    color: var(--color-gray-600);
    font-weight: 500;
    font-size: 0.875rem;
    border-width: 1px;
    border-style: solid;
    border-color: var(--color-gray-300);
    border-radius: 0.5rem;
    cursor: pointer;
    transition: background-color 0.15s;
}

.btn-outline:hover {
    background-color: var(--color-gray-100);
}

/* ── Danger button ── */
.btn-danger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-error-text);
    color: var(--color-surface);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    padding: 0.375rem 0.75rem;
    white-space: nowrap;
    border: none;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: background-color 0.15s;
}

.btn-danger:hover {
    background-color: var(--color-error-hover);
}

/* ── "Signed up" success button state ── */
.btn-signed-up {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-signed-up);
    color: var(--color-surface);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    padding: 0.375rem 0.75rem;
    white-space: nowrap;
    border: none;
    border-radius: 0.5rem;
    cursor: default;
}

/* ── Ministry action buttons ── */
.btn-details-ministry {
    display: inline-flex;
    align-items: center;
    font-size: 0.75rem;
    font-weight: 600;
    background-color: transparent;
    color: var(--color-primary-600);
    padding: 0.375rem 0.625rem;
    border-radius: 0.375rem;
    border: 1px solid var(--color-primary-400);
    cursor: pointer;
    transition: background-color 0.15s;
}

.btn-details-ministry:hover {
    background-color: var(--color-primary-50);
}

.btn-edit {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    background-color: var(--color-primary-100);
    color: var(--color-navy);
    padding: 0.375rem 0.5rem;
    border-radius: 0.375rem;
    border: none;
    cursor: pointer;
    transition: background-color 0.15s;
}

.btn-edit:hover {
    background-color: var(--color-primary-200);
}

.btn-delete {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    background-color: var(--color-error-bg);
    color: var(--color-error-text);
    padding: 0.375rem 0.5rem;
    border-radius: 0.375rem;
    border: none;
    cursor: pointer;
    transition: background-color 0.15s;
}

.btn-delete:hover {
    background-color: var(--color-error-bg-light);
}
