/* t57u – frontend/account fixes and additions. Light + dark, mobile. */

/* Rating badge on dark pills (konto welcome): negative score uses the pill's own text colour (WCAG AA). */
.dash-pills .rt-badge.is-neg .rt-num { color: inherit; text-decoration: none; }
/* Homepage community block (always dark green): negative score in light salmon (≥ 7:1 on #1f4436). */
.hbx .rt-badge.is-neg .rt-num { color: #ffb4ab; }

/* Article stage: never crop – the picture fills the 4:3 stage box and is contained inside it. */
.pd-stage { position: relative; }
.pd-stage > img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; box-sizing: border-box; object-fit: contain; }

/* Konto dashboard offer thumbs: contain inside the 48px tile instead of overflowing. */
.dash-offers .ith { position: relative; }
.dash-offers .ith > img[data-ith] { position: absolute; inset: var(--ith-pad, 3px); width: calc(100% - 2 * var(--ith-pad, 3px)); height: calc(100% - 2 * var(--ith-pad, 3px)); object-fit: contain; }

/* Related articles: square tile, picture contained (portraits were overflowing the tile). */
.pd-rel-img { position: relative; }
.pd-rel-img > img { position: absolute; inset: 0; width: 100%; height: 100%; box-sizing: border-box; object-fit: contain; }

/* t57u: Privat/Business badge (t63u component) in the chat */
.cv-room-main strong { display: flex; align-items: center; gap: .35em; min-width: 0; }
.cv-room-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv-room-main strong > .ut-badge, .cv-room-main strong > .cv-tag { flex: none; }
.cm-name .ut-badge { font-size: .68rem; vertical-align: .05em; margin-left: .15em; }
.cv-head-main h2 .ut-badge { font-size: .62rem; vertical-align: .2em; }
.cv-people { position: relative; }
.cv-people > summary { position: relative; }
.cv-people-n { position: absolute; top: -4px; right: -6px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: #1d6b4f; color: #fff; font-size: .68rem; font-weight: 700; line-height: 18px; text-align: center; }
.cv-people-panel { min-width: 240px; max-height: 60vh; overflow: auto; }
.cv-people-h { margin: 0 0 6px; padding: 0 10px; font-size: .74rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.cv-people-panel ul { list-style: none; margin: 0; padding: 0; }
.cv-people-panel li { display: flex; align-items: center; gap: 8px; padding: 2px 10px 2px 0; }
.cv-people-panel li > a { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; }
.cv-people-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv-ava.cv-ava-sm { width: 28px; height: 28px; font-size: .78rem; flex: none; }
.cv-ava.cv-ava-sm img { width: 28px; height: 28px; }

/* t57u C: trade rules (Einstellungen › Zahlen) on article page, /konto and registration */
.t57-rules { display: grid; gap: 8px; margin-top: 12px; }
.t57-rule { margin: 0; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line, #e4dcc8); background: color-mix(in srgb, var(--card, #fff) 92%, #1d4e89); font-size: .88rem; line-height: 1.45; color: var(--ink, #1f2a24); }
.t57-rule p { margin: 0; }
.t57-rule i.fa-solid { margin-right: 4px; color: #1d4e89; }
.t57-rule.is-ok i.fa-solid { color: #17653f; }
.t57-rule.is-wait { border-color: #e2b15a; background: color-mix(in srgb, var(--card, #fff) 88%, #e2b15a); }
.t57-rule.is-wait i.fa-solid { color: #8a5a00; }
.t57-rule small { display: block; margin-top: 6px; color: var(--muted, #5f574c); }
.t57-rule a { font-weight: 600; }
.t57-prog { height: 8px; margin-top: 8px; border-radius: 99px; background: color-mix(in srgb, var(--line, #e4dcc8) 80%, transparent); overflow: hidden; }
.t57-prog > span { display: block; height: 100%; min-width: 4px; border-radius: inherit; background: linear-gradient(90deg, #1d6b4f, #2f9e6f); }
html[data-theme="dark"] .t57-rule { background: rgba(255, 255, 255, .04); border-color: rgba(246, 241, 232, .16); color: #f1ece2; }
html[data-theme="dark"] .t57-rule i.fa-solid { color: #9cc7f0; }
html[data-theme="dark"] .t57-rule.is-ok i.fa-solid { color: #8fd7c0; }
html[data-theme="dark"] .t57-rule.is-wait { border-color: rgba(226, 177, 90, .55); background: rgba(226, 177, 90, .1); }
html[data-theme="dark"] .t57-rule.is-wait i.fa-solid { color: #f2c46d; }
html[data-theme="dark"] .t57-rule small { color: rgba(246, 241, 232, .74); }
html[data-theme="dark"] .t57-rule a { color: #f2c46d; }

.t57-acc-rules { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; margin: 18px 0; }
.t57-acc-card { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; border-radius: 18px; border: 1px solid var(--a-line, var(--line, #e4dcc8)); background: var(--a-card, var(--card, #fff)); color: var(--a-ink, var(--ink, #1f2a24)); text-decoration: none; }
.t57-acc-card h2 { margin: 0 0 4px; font-size: 1rem; line-height: 1.3; }
.t57-acc-card p { margin: 0; font-size: .88rem; line-height: 1.45; color: var(--a-muted, var(--muted, #5f574c)); }
.t57-acc-card .t57-prog { margin: 8px 0 6px; }
.t57-acc-card > div { flex: 1; min-width: 0; }
.t57-acc-ico { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: color-mix(in srgb, #1d4e89 12%, transparent); color: #1d4e89; font-size: 1.05rem; }
.t57-acc-card.is-ok .t57-acc-ico { background: color-mix(in srgb, #17653f 14%, transparent); color: #17653f; }
.t57-acc-ico.is-gift { background: color-mix(in srgb, #b7791f 16%, transparent); color: #8a5a00; }
.t57-acc-card.is-link { transition: border-color .15s, box-shadow .15s, transform .15s; }
.t57-acc-card.is-link:hover, .t57-acc-card.is-link:focus-visible { border-color: #1d4e89; box-shadow: 0 12px 30px rgba(40, 32, 20, .1); transform: translateY(-1px); color: var(--a-ink, var(--ink, #1f2a24)); }
.t57-acc-go { align-self: center; color: var(--a-muted, var(--muted, #5f574c)); }
.t57-prem { white-space: nowrap; font-weight: 600; }
html[data-theme="dark"] .t57-acc-ico { background: rgba(156, 199, 240, .14); color: #9cc7f0; }
html[data-theme="dark"] .t57-acc-card.is-ok .t57-acc-ico { background: rgba(143, 215, 192, .14); color: #8fd7c0; }
html[data-theme="dark"] .t57-acc-ico.is-gift { background: rgba(226, 177, 90, .16); color: #f2c46d; }
html[data-theme="dark"] .t57-acc-card.is-link:hover, html[data-theme="dark"] .t57-acc-card.is-link:focus-visible { border-color: #9cc7f0; }

.rg-perks li.t57-rg-bonus { font-weight: 700; }
.rg-perks li.t57-rg-bonus i { color: #b7791f; }
html[data-theme="dark"] .rg-perks li.t57-rg-bonus i { color: #f2c46d; }
