/* Boutons */
.btn {
    --_bg: var(--jm-surface);
    --_ink: var(--jm-text);
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 46px; padding: 0 18px;
    font: inherit; font-weight: 600;
    color: var(--_ink); background: var(--_bg);
    border: 1px solid var(--jm-border); border-radius: var(--jm-radius);
    cursor: pointer; user-select: none;
    transition: transform .06s ease, box-shadow .15s ease, background .15s ease;
}
.btn:active { transform: translateY(1px) scale(.99); }
.btn:focus-visible { outline: none; box-shadow: 0 0 0 4px var(--jm-ring); }
.btn--primary { --_bg: var(--jm-primary); --_ink: var(--jm-primary-ink); border-color: transparent; }
.btn--accent  { --_bg: var(--jm-accent);  --_ink: #fff; border-color: transparent; }
.btn--ghost   { --_bg: transparent; border-color: var(--jm-border); }
.btn--block   { width: 100%; }

/* Champs */
.field { display: block; }
.field > .label { display: block; font-size: .85rem; font-weight: 600; color: var(--jm-text-muted); margin-bottom: 6px; }
.input {
    width: 100%; min-height: 46px; padding: 0 14px;
    font: inherit; color: var(--jm-text);
    background: var(--jm-surface);
    border: 1px solid var(--jm-border); border-radius: var(--jm-radius);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.input:focus { outline: none; border-color: var(--jm-primary); box-shadow: 0 0 0 4px var(--jm-ring); }

/* Carte / surface */
.card {
    background: var(--jm-surface);
    border: 1px solid var(--jm-border);
    border-radius: var(--jm-radius-lg);
    box-shadow: var(--jm-shadow-sm);
    padding: 18px;
}

/* Flash messages */
.flash { padding: 10px 14px; border-radius: var(--jm-radius); margin-bottom: 10px; font-size: .9rem; }
.flash-info    { background: color-mix(in srgb, var(--jm-accent) 12%, #fff); color: var(--jm-accent); }
.flash-success { background: color-mix(in srgb, #1a7f4b 14%, #fff); color: #1a7f4b; }
.flash-warning { background: color-mix(in srgb, var(--jm-bronze) 18%, #fff); color: var(--jm-bronze); }
.flash-error   { background: color-mix(in srgb, var(--jm-red) 12%, #fff); color: var(--jm-red-deep); }