/* ============================================================
   components/buttons.css — Public-Button-Klassen (0.1.4)
   ------------------------------------------------------------
   0.1.4: .pub-btn--danger ergänzt für gefährliche Aktionen
   (z.B. "Von allen Geräten abmelden", "Reitstunde abmelden").
============================================================ */

.pub-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: var(--pub-control-height);
    padding: 8px 18px;
    font: inherit;
    font-weight: 600;
    line-height: 1.2;
    color: var(--pub-text);
    background: var(--pub-bg-surface);
    border: 1px solid var(--pub-border-strong);
    border-radius: var(--pub-radius-sm);
    text-decoration: none;
    cursor: pointer;
    transition: background var(--pub-transition),
                color var(--pub-transition),
                border-color var(--pub-transition),
                box-shadow var(--pub-transition);
}

.pub-btn:hover,
.pub-btn:focus-visible {
    background: var(--pub-brand-tint);
    border-color: var(--pub-brand);
}

.pub-btn:focus-visible {
    outline: 2px solid var(--pub-brand);
    outline-offset: 2px;
}

.pub-btn:disabled,
.pub-btn[aria-disabled="true"] {
    opacity: 0.55;
    cursor: not-allowed;
    background: var(--pub-bg-subtle);
}

/* ----------------------------------------------------------------
   Primary — Brand-Farbe, gefüllt
   ---------------------------------------------------------------- */
.pub-btn--primary {
    background: var(--pub-brand);
    color: var(--pub-text-inverse);
    border-color: var(--pub-brand);
}

.pub-btn--primary:hover,
.pub-btn--primary:focus-visible {
    background: var(--pub-brand-strong);
    border-color: var(--pub-brand-strong);
    color: var(--pub-text-inverse);
}

/* ----------------------------------------------------------------
   Secondary — neutrale Card-Optik (Default-Stil)
   ---------------------------------------------------------------- */
.pub-btn--secondary {
    /* identisch zur Basis — Klasse als semantischer Marker */
}

/* ----------------------------------------------------------------
   Danger — destruktive Aktion (Geräte abmelden, Termin abmelden)
   0.1.4: NEU
   ---------------------------------------------------------------- */
.pub-btn--danger {
    background: var(--pub-bg-surface);
    color: var(--pub-danger);
    border-color: var(--pub-danger-border);
}

.pub-btn--danger:hover,
.pub-btn--danger:focus-visible {
    background: var(--pub-danger-bg);
    color: var(--pub-danger);
    border-color: var(--pub-danger);
}

.pub-btn--danger:focus-visible {
    outline: 2px solid var(--pub-danger);
    outline-offset: 2px;
}

/* Danger-Variante "voll gefüllt" — für besonders gewichtige Aktionen */
.pub-btn--danger-solid {
    background: var(--pub-danger);
    color: var(--pub-text-inverse);
    border-color: var(--pub-danger);
}

.pub-btn--danger-solid:hover,
.pub-btn--danger-solid:focus-visible {
    background: var(--pub-danger);
    color: var(--pub-text-inverse);
    border-color: var(--pub-danger);
    filter: brightness(0.92);
}

/* ----------------------------------------------------------------
   Ghost / Link-Style — keine Border, nur Text
   ---------------------------------------------------------------- */
.pub-btn--link {
    background: transparent;
    border-color: transparent;
    color: var(--pub-brand);
    padding-left: 6px;
    padding-right: 6px;
}

.pub-btn--link:hover,
.pub-btn--link:focus-visible {
    background: transparent;
    color: var(--pub-brand-strong);
    text-decoration: underline;
}

/* ----------------------------------------------------------------
   Größen
   ---------------------------------------------------------------- */
.pub-btn--lg {
    min-height: var(--pub-control-height-lg);
    padding: 10px 22px;
    font-size: 1rem;
}

.pub-btn--sm {
    min-height: 32px;
    padding: 4px 12px;
    font-size: 0.875rem;
}

.pub-btn--full {
    width: 100%;
}

/* ----------------------------------------------------------------
   Button-Gruppe (z.B. Submit + Cancel)
   ---------------------------------------------------------------- */
.pub-btn-group {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 8px;
}