/* ── SFG Kursübersicht + Kursdetail ─────────────────────────────────────── */

/* Gemeinsam: dunkles Badge (Nur Mitglieder) */
.sfg-badge-dark { background: #343a40; vertical-align: middle; }

/* ── Kursliste – Bild & Platzhalter ─────────────────────────────────────── */
.sfg-kurs-img { height: 210px; object-fit: cover; width: 100%; display: block; }

.sfg-kurs-placeholder {
    height: 210px;
    background: var(--sfg-green, #155c2a);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 3rem;
    font-weight: 700;
}

/* ── Kursliste – Card ───────────────────────────────────────────────────── */
.sfg-kurs-card {
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.06), 0 4px 16px rgba(0,0,0,.08);
    border: 1px solid rgba(0,0,0,.07);
}
.sfg-kurs-card .card-title {
    font-size: 1.4rem;
    font-weight: 700;
    color: #155c2a;
    line-height: 1.25;
    margin: 0 0 .75rem;
}

/* ── Kursliste – Meta-Zeilen (Uhrzeit, Ort, Datum) ──────────────────────── */
.sfg-meta { margin-bottom: 1rem; }
.sfg-meta-row {
    display: flex;
    align-items: flex-start;
    gap: .4rem;
    font-size: .84rem;
    color: #555;
    margin-bottom: .28rem;
    line-height: 1.4;
}
.sfg-meta-icon {
    color: var(--sfg-green, #155c2a);
    flex-shrink: 0;
    margin-top: 1px;
}

/* ── Kursliste – Weiterlesen-Link ───────────────────────────────────────── */
.sfg-weiterlesen-link {
    color: var(--sfg-green, #155c2a);
    font-size: .875rem;
    font-weight: 500;
    text-decoration: none;
}
.sfg-weiterlesen-link:hover {
    color: var(--sfg-green-2, #0f4a21);
    text-decoration: underline;
}

/* ── Kursliste – Preis-Chips ────────────────────────────────────────────── */
.sfg-price-row {
    display: flex;
    gap: .75rem;
}
.sfg-price-chip {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: .6rem .5rem;
    border-radius: 10px;
    line-height: 1.2;
}
.sfg-price-chip--member {
    background: var(--sfg-green, #155c2a);
    color: #fff;
}
.sfg-price-chip--other {
    background: #212529;
    color: #fff;
}
.sfg-price-lbl   { font-size: .72rem; font-weight: 400; opacity: .85; }
.sfg-price-value { font-size: 1.35rem; font-weight: 700; }

/* ── Kursliste – Button ─────────────────────────────────────────────────── */
.sfg-kurs-card .btn-success {
    background: var(--sfg-green, #155c2a);
    border-color: var(--sfg-green, #155c2a);
    border-radius: 8px;
    font-weight: 500;
    font-size: .9rem;
}
.sfg-kurs-card .btn-success:hover,
.sfg-kurs-card .btn-success:focus {
    background: var(--sfg-green-2, #0f4a21);
    border-color: var(--sfg-green-2, #0f4a21);
}

/* ── Kursdetail ─────────────────────────────────────────────────────────── */
.sfg-kd-title {
    color: var(--sfg-green, #155c2a);
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.1;
}

.sfg-kd-img { width: 100%; max-height: 320px; object-fit: cover; }

.card.sfg-kd-card {
    border: 2px solid var(--sfg-green, #155c2a);
    border-radius: 1rem;
    overflow: hidden;
}

.card.sfg-kd-hint-card {
    border-radius: 1rem;
    overflow: hidden;
}

.sfg-kd-bullet {
    color: var(--sfg-green, #155c2a);
    font-size: .6rem;
    margin-top: .35rem;
}

.sfg-kd-label { color: var(--sfg-green, #155c2a); letter-spacing: .06em; }

.sfg-kd-price-member { background: var(--sfg-green, #155c2a); }
.sfg-bg-dark          { background: #343a40; }
.sfg-kd-price-ls      { letter-spacing: .06em; }
.sfg-kd-price-value   { font-size: 1.75rem; font-weight: 700; }