/* SelectivePro Kundenbereich - nutzt die Tokens aus ../assets/style.css */

.acc-body{ display:flex; flex-direction:column; min-height:100dvh; background:var(--bg); }

/* top bar */
.acc-top{ display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:14px clamp(18px,4vw,40px); border-bottom:1px solid var(--line); background:var(--surface); }
.acc-brand{ display:inline-flex; align-items:center; gap:10px; }
.acc-brand__logo{ width:34px; height:34px; border-radius:10px; overflow:hidden; box-shadow:var(--shadow); }
.acc-brand__logo img{ width:100%; height:100%; object-fit:cover; transform:scale(1.08); }
.acc-top__nav{ display:flex; align-items:center; gap:18px; }
.acc-top__nav a{ font-size:.92rem; color:var(--ink-soft); }
.acc-top__nav a:hover{ color:var(--ink); }
.btn--sm{ padding:8px 15px; font-size:.86rem; }

.acc-main{ flex:1; width:100%; max-width:920px; margin-inline:auto; padding:clamp(28px,5vw,56px) clamp(18px,4vw,24px); }

/* auth cards */
.acc-card{ max-width:440px; margin:2vh auto; background:var(--surface); border:1px solid var(--line);
  border-radius:20px; padding:34px 30px; box-shadow:var(--shadow-lg); }
.acc-card h1{ font-size:1.5rem; letter-spacing:-.02em; margin-bottom:8px; }
.acc-sub{ color:var(--muted); font-size:.95rem; margin-bottom:22px; }
.acc-card form{ display:grid; gap:16px; }
.acc-card label, .acc-block label{ display:block; font-size:.84rem; font-weight:560; color:var(--ink-soft); }
.acc-card label small{ color:var(--muted); font-weight:400; }
.acc-card input, .acc-block input{ width:100%; margin-top:7px; padding:11px 13px; font:inherit; font-size:.95rem;
  color:var(--ink); background:var(--bg); border:1px solid var(--line); border-radius:11px; transition:border-color .15s, box-shadow .15s; }
.acc-card input:focus{ outline:none; border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%, transparent); }
.acc-card .btn{ width:100%; }
.acc-alt{ margin-top:20px; font-size:.9rem; color:var(--muted); text-align:center; }

/* flash */
.acc-flash{ padding:11px 14px; border-radius:11px; font-size:.9rem; margin-bottom:18px; }
.acc-flash--err{ background:color-mix(in srgb,#d1544e 12%, var(--surface)); color:#b23b36;
  border:1px solid color-mix(in srgb,#d1544e 40%, transparent); }

/* dashboard */
.acc-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:30px; }
.acc-head h1{ font-size:1.7rem; letter-spacing:-.025em; }
.acc-block{ margin-bottom:36px; }
.acc-block h2{ font-size:1.15rem; letter-spacing:-.015em; margin-bottom:16px; }
.acc-hint{ margin-top:14px; font-size:.9rem; color:var(--muted); }
.muted{ color:var(--muted); }

.lic-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:16px; }
.lic{ background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:20px; box-shadow:var(--shadow); }
.lic.off{ opacity:.72; }
.lic__top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.lic__plan{ font-weight:600; letter-spacing:-.01em; }
.lic__state{ font-size:.76rem; font-weight:600; padding:3px 10px; border-radius:999px; }
.lic__state--ok{ background:color-mix(in srgb,#2f9e6f 16%, transparent); color:#2f9e6f; }
.lic__state--off{ background:color-mix(in srgb,#d1544e 15%, transparent); color:#c14a44; }
.lic__key{ display:flex; align-items:center; gap:8px; background:var(--bg); border:1px solid var(--line);
  border-radius:10px; padding:10px 12px; margin-bottom:14px; }
.lic__key code{ flex:1; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.92rem; letter-spacing:.02em; color:var(--accent-ink); }
.lic__copy{ border:none; background:var(--brand); color:#fff; font:inherit; font-size:.78rem; font-weight:560;
  padding:5px 11px; border-radius:8px; cursor:pointer; }
.lic__copy:hover{ background:var(--brand-600); }
.lic__copy.done{ background:#2f9e6f; }
.lic__meta{ display:flex; gap:24px; margin:0; }
.lic__meta dt{ font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.lic__meta dd{ margin:2px 0 0; font-size:.94rem; font-weight:520; }

.acc-empty{ background:var(--surface); border:1px dashed var(--line); border-radius:16px; padding:30px 26px; }
.acc-empty p{ margin:0 0 6px; }

.acc-dl{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:18px 20px; box-shadow:var(--shadow); }
.acc-dl b{ display:block; }
.acc-dl .muted{ font-size:.88rem; }

.acc-foot{ display:flex; justify-content:space-between; padding:22px clamp(18px,4vw,40px);
  border-top:1px solid var(--line); color:var(--muted); font-size:.85rem; }

@media (max-width:560px){ .acc-head{ flex-direction:column; align-items:flex-start; } }

/* ---------- Support ---------- */
.sup-form{ display:grid; gap:16px; background:var(--surface); border:1px solid var(--line);
  border-radius:16px; padding:22px; box-shadow:var(--shadow); }
.sup-form textarea{ width:100%; margin-top:6px; padding:11px 13px; font:inherit; font-size:.95rem;
  color:var(--ink); background:var(--bg); border:1px solid var(--line); border-radius:11px; resize:vertical; }
.sup-form textarea:focus, .sup-form input:focus{ outline:none; border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%, transparent); }
.sup-form input[type=file]{ width:100%; margin-top:6px; padding:10px; font-size:.9rem;
  background:var(--bg); border:1px dashed var(--line); border-radius:11px; }
.acc-flash--ok{ background:color-mix(in srgb,#2f9e6f 12%, var(--surface)); color:#2f9e6f;
  border:1px solid color-mix(in srgb,#2f9e6f 40%, transparent); }
.sup-list{ list-style:none; margin:0; padding:0; }
.sup-list li{ display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:14px 0; border-bottom:1px solid var(--line-soft); }
.sup-list li:last-child{ border-bottom:none; }
.sup-list__main{ display:flex; flex-direction:column; gap:3px; }
.sup-list__main .muted{ font-size:.82rem; }
.sup-state{ font-size:.76rem; font-weight:600; padding:4px 11px; border-radius:999px;
  background:var(--bg-2); color:var(--ink-soft); white-space:nowrap; }
.sup-state--new{ background:color-mix(in srgb,#e08a2b 18%, transparent); color:#b8701f; }
.sup-state--closed{ background:color-mix(in srgb,#2f9e6f 16%, transparent); color:#2f9e6f; }

/* ---------- Zustimmung AGB/Datenschutz ---------- */
.consent{ display:flex; align-items:flex-start; gap:11px; font-size:.88rem;
  line-height:1.55; color:var(--ink-soft); font-weight:400; }
.consent input[type=checkbox]{ width:18px; height:18px; margin:2px 0 0; flex-shrink:0;
  accent-color:var(--brand); cursor:pointer; }
.consent a{ color:var(--accent-ink); text-decoration:underline; text-underline-offset:2px; }
.consent a:hover{ color:var(--accent); }