/*
 * TCG Keeper
 * Copyright (c) Mario Löser. Alle Rechte vorbehalten.
 * Dieses Skript und der gesamte Quellcode von TCG Keeper sind geistiges
 * Eigentum von Mario Löser und dürfen ohne ausdrückliche
 * Zustimmung nicht ohne diesen Hinweis weiterverwendet oder verbreitet
 * werden.
 */
/* Benutzerverwaltung, Rechteprofile, Mein Konto, zentrale Protokolle,
   Nachrichten, Tickets und Tauschbörse (14.10.2026). Baut auf den
   Variablen und Bausteinen aus app-1 … app-14 auf (dm-*, vp-*, pc-*). */

/* ---- Hinweiskasten (z. B. persönliche Einladung auf der Registrierung) ---- */
.notice-box{ padding:10px 14px; border-radius:10px; background:var(--accent-soft); color:var(--ink); border:1px solid var(--line); margin:0 0 14px; font-size:14px; }

/* ---- Avatare ---- */
.pc-avatar-img{ border-radius:50%; object-fit:cover; flex:0 0 auto; display:inline-block; background:var(--paper-sunken); }

/* ---- Benutzerverwaltung: Gruppen-Pillen und Kontokarten ---- */
.ua-role{ font-weight:600; }
.ua-role-superadmin{ background:linear-gradient(90deg, var(--gold-soft), var(--accent-soft)); color:var(--accent); }
.ua-role-admin{ background:var(--accent-soft); color:var(--accent); }
.ua-role-user{ background:var(--paper-sunken); color:var(--ink-soft); }
.ua-account.ua-superadmin{ border-color:var(--accent); box-shadow:inset 3px 0 0 var(--accent); }
.ua-account.ua-admin{ box-shadow:inset 3px 0 0 var(--accent-soft); }
.ua-filter{ margin:0 0 14px; display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; }
.ua-filter .field{ flex:1 1 200px; margin:0; }
.ua-filter .field .btn{ width:auto; }
.ua-status-form{ display:inline-flex; gap:6px; align-items:center; flex-wrap:wrap; }
.ua-status-form .form-input{ width:170px; padding:5px 9px; font-size:13px; }
.btn.is-disabled{ opacity:.45; pointer-events:none; }

/* ---- Freigaben / Papierkorb ---- */
.ua-trash-list{ display:flex; flex-direction:column; gap:10px; margin-top:12px; }
.ua-trash{ border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:var(--paper-raised); display:flex; flex-direction:column; gap:8px; }
.ua-trash-pending{ border-color:var(--gold); box-shadow:inset 3px 0 0 var(--gold); }
.ua-trash-restored{ opacity:.8; }
.ua-trash-purged{ opacity:.65; }
.ua-trash-head{ display:flex; gap:10px; align-items:flex-start; }

/* ---- Rechteprofil-Editor: Filterboxen, Protokoll-Rechte ---- */
.rv-fb-list{ display:flex; flex-direction:column; gap:6px; }
.rv-fb{ border:1px solid var(--line); border-radius:10px; background:var(--paper-raised); }
.rv-fb > summary{ cursor:pointer; padding:9px 12px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; list-style:none; }
.rv-fb > summary::-webkit-details-marker{ display:none; }
.rv-fb > summary::before{ content:'▸'; color:var(--ink-faint); margin-right:4px; transition:transform .15s; }
.rv-fb[open] > summary::before{ transform:rotate(90deg); }
.rv-fb-title{ font-weight:600; }
.rv-fb-body{ padding:4px 12px 12px; display:flex; flex-direction:column; gap:8px; }
.rv-fb-row, .rv-fb-fields{ display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; }
.rv-fb-row .form-select{ padding:4px 8px; font-size:13px; }
.rv-fb-fields{ padding:8px 10px; border-radius:8px; background:var(--paper-sunken); }
.rv-log-table td.num, .rv-log-table th.num{ text-align:center; width:110px; }

/* ---- Zentrale Protokolle ---- */
.proto-src-tabs{ flex-wrap:wrap; }
.proto-toolbar .form-input{ padding:5px 9px; font-size:13px; }
.proto-table td:nth-child(2){ white-space:nowrap; }
.proto-day .vp-kpis{ margin-top:4px; }

/* ---- Mein Konto ---- */
.konto-profile{ display:flex; flex-direction:column; gap:12px; }
.konto-fields{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:12px; }
.konto-field{ display:flex; flex-direction:column; gap:4px; }
.konto-field .konto-field-row{ display:flex; gap:6px; align-items:center; }
.konto-field .konto-field-row > .form-input, .konto-field .konto-field-row > .form-textarea{ flex:1 1 auto; min-width:0; }
.konto-vis{ flex:0 0 auto; width:auto; padding:5px 8px; font-size:12.5px; }
.konto-sub{ margin:8px 0 2px; font-size:14px; color:var(--ink-soft); }
.konto-avatar{ display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.konto-cats{ display:flex; flex-wrap:wrap; gap:6px 16px; }

/* Kleine POST-Knöpfe nebeneinander */
.pc-post-btn{ display:inline; margin:0; }

@media (max-width:640px){
  .ua-status-form .form-input{ width:100%; }
  .konto-fields{ grid-template-columns:1fr; }
  .rv-log-table td.num, .rv-log-table th.num{ width:auto; }
}

/* =====================================================================
   Stufe 2 (14.10.2026): Nachrichten, Tickets, Tauschbörse, Profil
   ===================================================================== */

/* ---- Zähler und Kopfleisten-Knöpfe ---- */
.pc-badge{ display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px; margin-left:4px; border-radius:99px;
  background:var(--danger, #c0392b); color:#fff; font-size:11px; font-weight:700; line-height:1; font-family:var(--font-mono); vertical-align:middle; }
.pc-badge[hidden]{ display:none !important; }
.pc-msg-link, .pc-bug-btn{ position:relative; display:inline-flex; align-items:center; gap:4px; }
.pc-msg-link .pc-badge, .pc-bug-btn .pc-badge{ position:absolute; top:-6px; right:-6px; margin:0; }
.pc-bb-item .pc-badge{ position:absolute; top:2px; right:calc(50% - 20px); }
.pc-bb-item.pc-msg-link, .pc-bb-item.js-bug-report{ position:relative; }

/* ---- Käfer-Fenster ---- */
.pc-bug-panel{ max-width:620px; width:calc(100vw - 32px); }
.pc-bug-msg{ min-height:1.4em; margin:6px 0; font-size:14px; }

/* ---- Nachrichten ---- */
.msg-layout{ display:grid; grid-template-columns:230px minmax(0, 1fr); gap:16px; align-items:start; }
.msg-folders{ display:flex; flex-direction:column; gap:2px; padding:10px; position:sticky; top:80px; }
.msg-folders hr{ border:0; border-top:1px solid var(--line); margin:8px 0; width:100%; }
.msg-folder{ display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:9px; color:var(--ink-soft); text-decoration:none; font-size:14px; }
.msg-folder span:nth-child(2){ flex:1; }
.msg-folder:hover{ background:var(--paper-sunken); color:var(--accent); }
.msg-folder.is-active{ background:var(--accent-soft); color:var(--accent); font-weight:600; }
.msg-kind{ font-size:13px; padding:6px 10px; }
.msg-n{ font-family:var(--font-mono); font-size:11.5px; color:var(--ink-faint); }
.pc-count{ font-family:var(--font-mono); font-size:11px; padding:2px 7px; border-radius:99px; background:var(--paper-sunken); }
.pc-count.is-hot{ background:var(--accent); color:#fff; }
.msg-h{ display:flex; align-items:center; gap:8px; margin:0; font-size:18px; flex:1 1 auto; }
.msg-search{ display:flex; gap:6px; align-items:center; margin-bottom:10px; flex-wrap:wrap; }
.msg-search .form-input{ flex:1 1 220px; }
.msg-list{ list-style:none; margin:0; padding:0; }
.msg-row a{ display:grid; grid-template-columns:24px minmax(110px, 180px) minmax(0, 1fr) auto; gap:10px; align-items:center; padding:10px 8px;
  border-bottom:1px solid var(--line); color:var(--ink); text-decoration:none; }
.msg-row a:hover{ background:var(--paper-sunken); }
.msg-row.is-unread a{ font-weight:600; background:color-mix(in srgb, var(--accent-soft) 45%, transparent); }
.msg-who, .msg-subj{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.msg-snip{ color:var(--ink-faint); font-weight:400; }
.msg-meta{ font-size:12.5px; color:var(--ink-faint); white-space:nowrap; display:inline-flex; gap:4px; align-items:center; }
.msg-icon{ color:var(--accent); display:inline-flex; }
.msg-read-head{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:12px; }
.msg-item{ border:1px solid var(--line); border-radius:12px; padding:12px 14px; margin-top:10px; background:var(--paper-raised); }
.msg-item.is-mine{ border-left:3px solid var(--accent); }
.msg-item.is-current{ box-shadow:0 0 0 2px var(--accent-soft); }
.msg-item header{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:8px; }
.msg-sys{ background:var(--accent-soft); color:var(--accent); }
.msg-body{ white-space:normal; line-height:1.55; overflow-wrap:anywhere; }
.msg-files{ list-style:none; padding:0; margin:10px 0 0; display:flex; flex-direction:column; gap:6px; }
.msg-thumb{ display:block; max-width:220px; max-height:160px; border-radius:8px; margin-top:4px; border:1px solid var(--line); }
.msg-quote{ margin:8px 0; padding:8px 12px; border-left:3px solid var(--line); background:var(--paper-sunken); border-radius:0 8px 8px 0; color:var(--ink-soft); font-size:14px; }
.msg-to{ min-height:90px; }
.msg-compose .form-field{ margin-bottom:10px; }

/* ---- Tickets ---- */
.tk-table td{ vertical-align:top; }
.tk-ok{ background:var(--good-soft); color:var(--good); }
.tk-bad{ background:var(--danger-soft); color:var(--danger); }
.tk-warn{ background:var(--gold-soft); color:var(--gold); }
.tk-info{ background:var(--accent-soft); color:var(--accent); }
.tk-value{ background:var(--accent-soft); color:var(--accent); }
.tk-neutral{ background:var(--paper-sunken); color:var(--ink-soft); }
.tk-ticket .tk-body{ white-space:normal; line-height:1.55; margin:8px 0 12px; overflow-wrap:anywhere; }
.tk-events{ list-style:none; padding:0; margin:8px 0 0; display:flex; flex-direction:column; gap:8px; }
.tk-ev{ border:1px solid var(--line); border-radius:10px; padding:8px 12px; background:var(--paper-raised); }
.tk-ev.is-internal{ border-style:dashed; background:var(--gold-soft); }
.tk-ev-status, .tk-ev-meta, .tk-ev-created{ background:var(--paper-sunken); }
.tk-ev header{ display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; }
.tk-status{ margin:4px 0 0; font-size:14px; white-space:normal; overflow-wrap:anywhere; }
.tk-reply{ margin-top:12px; }

/* ---- Tauschbörse ---- */
.tr-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:12px; }
.tr-market{ border:1px solid var(--line); border-radius:12px; padding:10px; background:var(--paper-raised); display:flex; flex-direction:column; gap:8px; }
.tr-market.is-wish{ border-color:var(--accent); box-shadow:inset 3px 0 0 var(--accent); }
.tr-card{ display:block; }
.tr-pick{ display:flex; gap:10px; align-items:flex-start; cursor:default; }
label.tr-pick{ cursor:pointer; padding:6px; border-radius:10px; }
label.tr-pick:hover{ background:var(--paper-sunken); }
label.tr-pick input{ margin-top:4px; }
label.tr-pick:has(input:checked){ background:var(--accent-soft); }
.tr-img{ width:62px; height:auto; border-radius:5px; flex:0 0 auto; box-shadow:0 1px 3px rgba(0,0,0,.15); }
.tr-info{ display:flex; flex-direction:column; gap:2px; min-width:0; font-size:14px; }
.tr-info small{ color:var(--ink-soft); font-size:12.5px; }
.tr-note{ font-style:italic; }
.tr-photos{ display:flex; gap:4px; margin-top:4px; }
.tr-photo{ width:42px; height:42px; object-fit:cover; border-radius:6px; border:1px solid var(--line); }
.tr-sides{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; margin:12px 0; }
.tr-side{ border:1px solid var(--line); border-radius:12px; padding:10px 12px; background:var(--paper-raised); min-width:0; }
.tr-side h3{ margin:0 0 8px; font-size:15px; display:flex; gap:6px; align-items:center; }
.tr-pick-list{ max-height:420px; overflow:auto; display:flex; flex-direction:column; gap:2px; }
.tr-filter{ margin-bottom:8px; }
.tr-actions{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:10px 0; }
.tr-counter{ border:1px dashed var(--line); border-radius:12px; padding:8px 12px; margin:10px 0; }
.tr-counter > summary{ cursor:pointer; font-weight:600; display:flex; gap:6px; align-items:center; }
.tr-rollback{ margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); }
.tr-wanted{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:6px; }

/* ---- Tauschbörse: Fehlerbehebung 14.10.2026 ---- */
/* [hidden] muss gegen .tr-card{display:block} gewinnen — sonst blendet der Filter nichts aus. */
.tr-card[hidden], .tr-filter-empty[hidden]{ display:none !important; }
/* Kartenrückseite (img-placeholder) und echte Bilder immer gleich klein. */
.tr-card img.tr-img{ width:62px; max-width:62px; height:auto; aspect-ratio:auto; object-fit:contain; }
.tr-card img.img-placeholder{ opacity:.7; }
.tr-info b{ overflow-wrap:anywhere; }
.tr-photos{ flex-wrap:wrap; align-items:center; }
[data-tr-zoom]{ cursor:zoom-in; }
.tr-card img[data-tr-zoom]{ transition:transform .15s, box-shadow .15s; }
.tr-card img[data-tr-zoom]:hover, .tr-card img[data-tr-zoom]:focus-visible{ transform:scale(1.04); box-shadow:0 0 0 2px var(--accent); outline:none; }
.tr-photo-more{ width:42px; height:42px; border-radius:6px; border:1px dashed var(--line); background:var(--paper-sunken); color:var(--ink-soft); font:600 13px/1 inherit; padding:0; }
.tr-photo-more:hover{ border-color:var(--accent); color:var(--accent); }
.tr-filter-row{ display:flex; flex-direction:column; gap:3px; margin-bottom:8px; }
.tr-filter-row .tr-filter{ margin-bottom:0; }
.tr-filter-count{ color:var(--ink-faint); font-size:12px; min-height:1em; }
.tr-pick-list{ scrollbar-width:thin; scrollbar-color:var(--line) transparent; padding-right:4px; }
.tr-pick-list::-webkit-scrollbar{ width:8px; }
.tr-pick-list::-webkit-scrollbar-track{ background:transparent; }
.tr-pick-list::-webkit-scrollbar-thumb{ background:var(--line); border-radius:8px; }
.tr-accept-hint{ margin:10px 0 0; }
.tr-actions button[disabled]{ opacity:.45; cursor:not-allowed; }
.tr-mark-msg{ font-size:12px; }
.tr-market .pc-actions{ align-items:center; flex-wrap:wrap; }

/* Großansicht Kartenbild + Exemplar-Fotos (assets/tausch.js) — eigene Klasse, nicht .lightbox-scrim */
html.trlb-open{ overflow:hidden; }
.trlb{ position:fixed; inset:0; z-index:1200; background:rgba(10,10,16,.88); display:flex; flex-direction:column; align-items:stretch; }
.trlb[hidden]{ display:none; }
.trlb-stage{ flex:1 1 auto; min-height:0; display:flex; align-items:center; justify-content:center; gap:10px; padding:48px 12px 8px; position:relative; }
.trlb-fig{ margin:0; display:flex; flex-direction:column; align-items:center; gap:8px; max-width:min(92vw, 900px); min-height:0; max-height:100%; }
.trlb-img{ max-width:100%; max-height:calc(100vh - 190px); object-fit:contain; border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,.5); background:#111; }
.trlb-cap{ color:#ECE8F6; font-size:14px; text-align:center; max-width:70ch; }
.trlb-count{ color:#AB8EEF; font-weight:700; margin-right:4px; }
.trlb-btn{ border:0; background:rgba(255,255,255,.1); color:#fff; border-radius:999px; width:44px; height:44px; font-size:26px; line-height:1; cursor:pointer; flex:0 0 auto; display:flex; align-items:center; justify-content:center; }
.trlb-btn:hover, .trlb-btn:focus-visible{ background:rgba(171,142,239,.35); outline:none; }
.trlb-btn[hidden]{ display:none; }
.trlb-close{ position:absolute; top:10px; right:12px; font-size:20px; }
.trlb-thumbs{ display:flex; gap:6px; justify-content:center; overflow-x:auto; padding:8px 12px 14px; flex:0 0 auto; }
.trlb-thumbs[hidden]{ display:none; }
.trlb-thumb{ border:2px solid transparent; border-radius:8px; padding:0; background:none; cursor:pointer; flex:0 0 auto; opacity:.65; }
.trlb-thumb.is-active{ border-color:#AB8EEF; opacity:1; }
.trlb-thumb img{ display:block; height:60px; width:auto; max-width:90px; object-fit:cover; border-radius:6px; }
@media (max-width:640px){
  .trlb-stage{ padding:52px 4px 4px; gap:2px; }
  .trlb-btn{ width:38px; height:38px; font-size:22px; }
  .trlb-img{ max-height:calc(100vh - 170px); }
}

/* ---- Profil und Verzeichnis ---- */
.prof-head{ display:flex; gap:16px; align-items:center; flex-wrap:wrap; margin-bottom:14px; }
.prof-titles{ flex:1 1 280px; min-width:0; }
.prof-head .pc-title{ margin:0; }
.prof-stars{ color:var(--gold); letter-spacing:1px; white-space:nowrap; }
.prof-fields{ display:grid; grid-template-columns:minmax(140px, 220px) 1fr; gap:6px 14px; margin:0; }
.prof-fields dt{ color:var(--ink-soft); display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.prof-fields dd{ margin:0; overflow-wrap:anywhere; }
.prof-cards{ display:grid; grid-template-columns:repeat(auto-fill, minmax(120px, 1fr)); gap:10px; }
.prof-card{ display:flex; flex-direction:column; gap:3px; text-decoration:none; color:var(--ink); font-size:13px; }
.prof-card img{ width:100%; height:auto; border-radius:6px; box-shadow:0 1px 3px rgba(0,0,0,.15); }
.prof-card small{ color:var(--ink-faint); font-size:11.5px; }
.prof-ratings{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; }
.dir-card .dm-account-title a{ color:inherit; text-decoration:none; }

@media (max-width:860px){
  .msg-layout{ grid-template-columns:1fr; }
  .msg-folders{ position:static; flex-direction:row; flex-wrap:wrap; }
  .msg-folders hr{ display:none; }
  .msg-row a{ grid-template-columns:22px minmax(0, 1fr) auto; }
  .msg-who{ grid-column:2; }
  .msg-subj{ grid-column:2 / 4; }
  .tr-sides{ grid-template-columns:1fr; }
  .prof-fields{ grid-template-columns:1fr; }
}