/* public/css/buttons.css */
/* The canonical .btn-primary / .btn-secondary pair.
 *
 * modal-utils.js hands these exact class names to the OK/Cancel/Confirm buttons
 * of every showAlert/showConfirm dialog, but each page used to define the pair
 * itself — five copies with drifting padding, font-size, weight and radius, so
 * one shared dialog rendered at a different size depending on where it opened.
 * pro.css carried a comment acknowledging the duplication.
 *
 * The values below are debate.html's, which was the most complete of the five
 * (it was the only one with a :disabled state on both variants). Consolidating
 * therefore leaves debate.html and tutorial.html pixel-identical, and visibly
 * changes forum (was 0.5rem/--text-sm), results (was 0.75rem 2rem/0.95rem) and
 * pro's modal radius (was --radius-md, 8px).
 *
 * Self-sufficient by design: font-family and cursor are set here rather than
 * inherited from a page-level `button` rule, because only some pages have one.
 *
 * Link AFTER theme.css (tokens) and BEFORE the page's own <style>, so a page
 * can still override a single property without redefining the component.
 */

.btn-primary,
.btn-secondary {
    font-family: inherit;
    font-size: 0.9rem;
    border-radius: var(--radius-btn);
    cursor: pointer;
    transition: background var(--transition-fast), border-color var(--transition-fast);
}

.btn-primary {
    padding: 0.6rem 1.5rem;
    background: var(--btn-primary-bg);
    color: var(--btn-primary-text);
    border: none;
    font-weight: 600;
}

.btn-secondary {
    padding: 0.6rem 1.25rem;
    background: var(--btn-secondary-bg);
    border: 1px solid var(--btn-secondary-border);
    color: var(--btn-secondary-text);
    font-weight: 500;
}

/* :not(:disabled) so hovering a dead button does not light it up. */
.btn-primary:not(:disabled):hover {
    background: var(--btn-primary-hover);
}

.btn-secondary:not(:disabled):hover {
    border-color: var(--btn-secondary-hover-border);
}

.btn-primary:disabled,
.btn-secondary:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}