/*
============================================================
 RODORN PROJEKT — rodorn-design.com
 © 2026 Rodorn. Alle Rechte vorbehalten.
 Datei: assets/css/affiliate.css
 Letzte Aktualisierung: 22.07.2026, 11:42 Uhr (Berlin)
============================================================
*/

/* Provisionskarte in der Seitenleiste */
.aff-rate-card { margin-top: auto; border: 1px solid var(--a-line); border-radius: 12px; padding: 16px; text-align: center; display: flex; flex-direction: column; gap: 4px; }
.aff-rate-card span { font-size: 12px; color: var(--a-muted); }
.aff-rate-card strong { font-size: 30px; font-weight: 600; }
.aff-rate-card small { font-size: 12px; color: var(--a-muted); margin-bottom: 10px; }

/* Code-Karte im Dashboard */
.aff-code-card { text-align: left; }
.aff-code-box { display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid var(--a-line); border-radius: 10px; padding: 14px 16px; margin: 10px 0 14px; }
.aff-code-box b { font-size: 19px; letter-spacing: .28em; font-weight: 600; }
.aff-link-box { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--a-line-soft); border-radius: 10px; padding: 10px 14px; font-size: 12.5px; margin-bottom: 14px; overflow: hidden; }
.aff-link-box span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--a-muted); }
.copy-btn { flex: 0 0 auto; background: none; border: 1px solid var(--a-line); border-radius: 8px; padding: 6px 11px; font: 400 12px var(--a-sans); cursor: pointer; }
.copy-btn:hover { border-color: var(--a-ink); }

/* Textbausteine (Werbemittel) */
.aff-snippet { background: var(--a-line-soft); border-radius: 10px; padding: 14px 16px; font-size: 14px; line-height: 1.6; margin-bottom: 10px; }
.aff-logo-tile { display: flex; align-items: center; gap: 16px; border: 1px solid var(--a-line); border-radius: 12px; padding: 16px 18px; }
.aff-logo-tile svg { width: 40px; height: 40px; }

/* 15.08.: Partner-Portal – Ansichten neu aufgebaut */
.kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; margin-bottom: 18px; }
.kpi-card { background: #fff; border: 1px solid var(--line, #e6e6e3); padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; }
.kpi-label { font: 500 10.5px/1 'Jost', sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #8a8a8a; }
.kpi-value { font: 400 22px/1.2 'Jost', sans-serif; color: #111; }
.kpi-trend { font-size: 11.5px; }
.kpi-trend.up { color: #2e7d32; } .kpi-trend.down { color: #b23c3c; }
.aff-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.aff-code-row { display: grid; grid-template-columns: 1fr 1.4fr auto; gap: 18px; align-items: center; }
.aff-code { font: 500 20px/1.2 'Jost', sans-serif; letter-spacing: .12em; display: block; }
.aff-link { display: block; font-size: 12.5px; word-break: break-all; background: #f6f6f4; padding: 8px 10px; }
.aff-dist { display: grid; grid-template-columns: 130px 1fr 90px; gap: 10px; align-items: center; margin-bottom: 8px; font-size: 13px; }
.aff-dist .bar { background: #eee; height: 8px; display: block; }
.aff-dist .bar i { display: block; height: 8px; }
.aff-dist strong { text-align: right; }
.aff-snippet { margin-bottom: 16px; }
.aff-snippet textarea { width: 100%; border: 1px solid var(--line, #e6e6e3); border-radius: 0; padding: 10px; font: 400 13px/1.6 'Jost', sans-serif; resize: vertical; }
@media (max-width: 900px) { .aff-grid2, .aff-code-row { grid-template-columns: 1fr; } }