/* ── Chiptuning Plugin — Dark Theme ── */
.cht-wrap { max-width: 860px; margin: 0 auto; padding: 20px 15px; font-family: Arial, sans-serif; color: #ddd; }

.cht-h1 { font-size: 1.7em; color: #fff; border-bottom: 3px solid #e30000; padding-bottom: 10px; margin-bottom: 6px; }
.cht-h2 { font-size: 1.1em; color: #eee; margin: 24px 0 10px; border-left: 3px solid #e30000; padding-left: 8px; }
.cht-lead { color: #888; margin-bottom: 22px; font-size: 0.95em; }
.cht-sub { color: #888; font-size: 0.9em; margin-bottom: 20px; }

.cht-breadcrumb { font-size: 0.82em; color: #555; margin-bottom: 18px; }
.cht-breadcrumb a { color: #e30000; text-decoration: none; }
.cht-breadcrumb a:hover { text-decoration: underline; }

/* ── Brand Grid ── */
.cht-cat-block { margin-bottom: 30px; }
.cht-cat-title { font-size: 0.8em; background: #1a1a1a; color: #888; padding: 5px 10px; border-left: 3px solid #e30000; margin-bottom: 10px; text-transform: uppercase; letter-spacing: 1px; }
.cht-brand-grid { display: flex; flex-wrap: wrap; gap: 8px; }
.cht-brand-card { display: flex; flex-direction: column; background: #111; border: 1px solid #2a2a2a; padding: 10px 14px; text-decoration: none !important; color: #ccc !important; min-width: 130px; border-radius: 4px; }
.cht-brand-card:hover { border-color: #e30000; color: #fff !important; background: #1a0808; }
.cht-brand-name { font-weight: bold; font-size: 0.9em; }
.cht-brand-count { font-size: 0.72em; color: #555; margin-top: 3px; }

/* ── Model List ── */
.cht-model-list { border: 1px solid #222; border-radius: 4px; overflow: hidden; }
.cht-model-row { display: flex; align-items: center; padding: 12px 16px; border-bottom: 1px solid #1a1a1a; text-decoration: none !important; color: #ccc !important; background: #0d0d0d; }
.cht-model-row:last-child { border-bottom: none; }
.cht-model-row:hover { background: #1a0808; color: #fff !important; }
.cht-model-name { flex: 1; font-weight: bold; font-size: 1em; }
.cht-model-stages { font-size: 0.78em; color: #555; margin-right: 12px; }
.cht-arrow { color: #e30000; font-size: 1.2em; }

/* ── Engine List ── */
.cht-engine-list { display: flex; flex-direction: column; gap: 12px; }

.cht-engine-block { border: 1px solid #2a2a2a; border-left: 4px solid #e30000; border-radius: 0 4px 4px 0; overflow: hidden; background: #0d0d0d; }

.cht-engine-header { padding: 12px 16px; background: #141414; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; border-bottom: 1px solid #1e1e1e; }
.cht-engine-gen { font-size: 0.78em; color: #666; text-transform: uppercase; letter-spacing: 0.5px; }
.cht-engine-name { font-size: 1em; color: #eee; font-weight: bold; flex: 1; }
.cht-engine-gain { font-size: 0.8em; background: #e30000; color: #fff !important; padding: 2px 10px; border-radius: 20px; font-weight: bold; white-space: nowrap; }

/* ── Stage Buttons — große klickbare Zeilen ── */
.cht-stage-buttons { display: flex; flex-direction: column; }

.cht-stage-btn { display: flex; align-items: center; padding: 13px 18px; text-decoration: none !important; font-size: 0.95em; font-weight: bold; border-bottom: 1px solid #1a1a1a; color: #fff !important; transition: background 0.15s; }
.cht-stage-btn:last-child { border-bottom: none; }
.cht-stage-btn-icon { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75em; margin-right: 12px; flex-shrink: 0; }
.cht-stage-btn-label { flex: 1; }
.cht-stage-btn-arrow { color: #444; font-size: 1.1em; }

.cht-stage-btn--stage1 { background: #1a0000; }
.cht-stage-btn--stage1 .cht-stage-btn-icon { background: #e30000; color: #fff; }
.cht-stage-btn--stage1:hover { background: #2a0000; }
.cht-stage-btn--stage1:hover .cht-stage-btn-arrow { color: #e30000; }

.cht-stage-btn--stage2 { background: #130000; }
.cht-stage-btn--stage2 .cht-stage-btn-icon { background: #900; color: #fff; }
.cht-stage-btn--stage2:hover { background: #200000; }
.cht-stage-btn--stage2:hover .cht-stage-btn-arrow { color: #e30000; }

.cht-stage-btn--eco { background: #001a08; }
.cht-stage-btn--eco .cht-stage-btn-icon { background: #1a6e3a; color: #fff; }
.cht-stage-btn--eco:hover { background: #002a10; }
.cht-stage-btn--eco:hover .cht-stage-btn-arrow { color: #2a7; }

/* ── Performance Box ── */
.cht-perf-box { display: flex; align-items: center; justify-content: center; gap: 0; background: #111; border: 1px solid #2a2a2a; border-left: 4px solid #e30000; border-radius: 0 4px 4px 0; padding: 24px 20px; margin: 20px 0; }
.cht-perf-col { text-align: center; flex: 1; }
.cht-perf-label { font-size: 0.68em; text-transform: uppercase; letter-spacing: 1.5px; color: #555; margin: 0 0 8px; }
.cht-perf-hp { font-size: 2.4em; font-weight: bold; margin: 0; color: #888; line-height: 1; }
.cht-perf-hp span { font-size: 0.4em; color: #444; margin-left: 2px; }
.cht-perf-nm { font-size: 0.85em; color: #444; margin: 6px 0 0; }
.cht-perf-after .cht-perf-hp { color: #e30000; }
.cht-perf-after .cht-perf-nm { color: #888; }
.cht-perf-divider { text-align: center; padding: 0 16px; }
.cht-gain-block { display: flex; flex-direction: column; gap: 6px; align-items: center; }
.cht-gain { font-size: 0.85em; background: #e30000; color: #fff !important; padding: 4px 12px; border-radius: 20px; font-weight: bold; }
.cht-arrow-icon { font-size: 1.8em; color: #2a2a2a; }

/* ── Intro Text ── */
.cht-intro-text { line-height: 1.8; color: #aaa; margin: 22px 0; padding: 18px 20px; background: #0d0d0d; border-left: 4px solid #2a2a2a; }
.cht-intro-text p { margin: 0 0 12px; }
.cht-intro-text p:last-child { margin-bottom: 0; }

/* ── Specs Table ── */
.cht-specs-table { width: 100%; border-collapse: collapse; margin: 10px 0 22px; }
.cht-specs-table tr { border-bottom: 1px solid #1a1a1a; }
.cht-specs-table th { padding: 9px 12px; color: #555; width: 42%; font-weight: normal; font-size: 0.88em; text-align: left; }
.cht-specs-table td { padding: 9px 12px; color: #ddd; font-weight: bold; font-size: 0.88em; }

/* ── Other Stages ── */
.cht-other-stages { display: flex; flex-direction: column; gap: 6px; margin-bottom: 22px; }
.cht-other-stage-btn { display: flex; align-items: center; padding: 10px 16px; background: #0d0d0d; border: 1px solid #222; border-left: 4px solid #333; text-decoration: none !important; color: #bbb !important; border-radius: 0 4px 4px 0; font-size: 0.9em; }
.cht-other-stage-btn:hover { border-left-color: #e30000; background: #1a0808; color: #fff !important; }

/* ── Addons ── */
.cht-addons { list-style: none; padding: 0; margin: 0 0 22px; }
.cht-addons li { padding: 7px 0; border-bottom: 1px solid #1a1a1a; font-size: 0.88em; color: #aaa; }
.cht-addons li::before { content: "✓ "; color: #e30000; font-weight: bold; }

/* ── Contact ── */
.cht-contact-box { background: #e30000; border-radius: 6px; padding: 30px 24px; margin-top: 32px; text-align: center; }
.cht-contact-box .cht-h2 { color: #fff !important; font-size: 1.4em; margin: 0 0 10px; padding: 0; border: none; font-weight: bold; }
.cht-contact-box p { color: rgba(255,255,255,0.88) !important; margin-bottom: 18px; font-size: 1em; }
.cht-btn-primary { display: inline-block; background: #fff; color: #e30000 !important; padding: 13px 36px; border-radius: 4px; text-decoration: none !important; font-weight: bold; font-size: 1em; }
.cht-btn-primary:hover { background: #f0f0f0 !important; color: #c00 !important; text-decoration: none !important; }
.cht-btn-primary:visited { color: #e30000 !important; }

@media (max-width: 650px) {
  .cht-perf-box { flex-direction: column; gap: 16px; }
  .cht-brand-card { min-width: 110px; }
  .cht-h1 { font-size: 1.35em; }
  .cht-perf-hp { font-size: 2em; }
}