/*
 * success_theme.css — Supplementary styles
 * All core design variables live in custom.css.
 * This file only adds things not already covered there.
 */

/* Ensure text contrast on dark card headers */
.card-header.bg-primary h1,
.card-header.bg-primary h2,
.card-header.bg-primary h3,
.card-header.bg-primary h4,
.card-header.bg-primary h5,
.card-header.bg-primary h6,
.card-header.bg-primary p,
.card-header.bg-primary span:not(.badge) {
  color: #fff !important;
}

.card-header.bg-success h1,
.card-header.bg-success h2,
.card-header.bg-success h3,
.card-header.bg-success h4,
.card-header.bg-success h5,
.card-header.bg-success h6 {
  color: #fff !important;
}

/* Body text inside cards */
.card-body p, .card-body li, .card-body span:not(.badge):not(.btn) {
  color: var(--text-body);
}

.card-body h1, .card-body h2, .card-body h3,
.card-body h4, .card-body h5, .card-body h6 {
  color: var(--text-heading);
}

/* Alert close button */
.alert .btn-close { filter: none; }
.alert-success .btn-close { color: #15803d; }
.alert-danger  .btn-close { color: #991b1b; }

/* Form helper text */
.form-text { color: var(--text-muted); font-size: 0.82rem; }

/* ── Section / Page backgrounds ──────────────────────────────── */
.tech-showcase,
.process-section,
.cta-section,
.hero-section {
  position: relative;
}

/* ── Stat cards on dashboard ─────────────────────────────────── */
.card-body h2 { color: var(--text-heading) !important; font-weight: 700; }
.card-body .fa-3x { opacity: 0.85; }

/* ── Subscription status badges ──────────────────────────────── */
.badge.p-2 {
  font-size: 0.8rem;
  border-radius: var(--radius-sm);
}

/* ── Owner request section ───────────────────────────────────── */
.success-card .card-header {
  background: var(--bg-section) !important;
  border-bottom: 1px solid var(--border);
}

/* Allow per-element header overrides (violet for owner section) */
[style*="linear-gradient(135deg, #7c3aed"] {
  background: linear-gradient(135deg, #7c3aed, #4f46e5) !important;
}

/* ── Collapse reply forms ─────────────────────────────────────── */
.collapse .form-control { font-size: 0.88rem; }

/* ── Progress bar in subscription page ───────────────────────── */
.progress-bar.bg-success { background: var(--color-success) !important; }
.progress-bar.bg-warning { background: var(--color-warning) !important; }
.progress-bar.bg-danger  { background: var(--color-danger) !important; }

/* ── Step indicator in review flow ───────────────────────────── */
.step-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
}

.step-indicator .step {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  font-size: 0.78rem;
  font-weight: 700;
  background: var(--bg-section);
  border: 2px solid var(--border);
  color: var(--text-muted);
}

.step-indicator .step.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.step-indicator .step.done {
  background: var(--color-success);
  border-color: var(--color-success);
  color: #fff;
}

.step-indicator .connector {
  flex: 1;
  max-width: 48px;
  height: 2px;
  background: var(--border);
  border-radius: 1px;
}

/* ── Prose / content pages (AGB, Datenschutz, Impressum) ─────── */
.prose-content h2 { margin-top: 2rem; color: var(--text-heading); }
.prose-content h3 { margin-top: 1.5rem; color: var(--text-heading); }
.prose-content p, .prose-content li { color: var(--text-body); line-height: 1.7; }

/* ── Owner dashboard accent override ─────────────────────────── */
.owner-accent { color: #7c3aed; }
.owner-accent-bg { background: rgba(124,58,237,0.08); border: 1px solid rgba(124,58,237,0.15); }

/* ── Smooth fade-in for page content ─────────────────────────── */
.fade-in {
  animation: fadeIn 0.4s ease-out;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Scrollbar in tables ─────────────────────────────────────── */
.table-responsive::-webkit-scrollbar { height: 5px; }
.table-responsive::-webkit-scrollbar-thumb { background: var(--border-medium); border-radius: 3px; }