/* RESET */
* {
  box-sizing: border-box;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

body {
  margin: 0;
  background: #f9fafb;
  color: #1f2937;
}

/* LAYOUT */
.container {
  max-width: 1000px;
  margin: 0 auto;
  padding: 24px;
}

h1, h2, h3 {
  margin-top: 0;
}

/* CARDS */
.card {
  background: #ffffff;
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}

/* BUTTONS */
button,
.card .btn {
  background: #6366f1;
  color: #ffffff;
  border: none;
  padding: 9px 14px;
  border-radius: 8px;
  cursor: pointer;
  font-weight: 600;
  text-decoration: none;
  display: inline-block;
}

button:hover,
.btn:hover {
  background: #4f46e5;
}

/* LINKS */
a {
  color: #6366f1;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* BADGES */
.badge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
}

.badge-verified {
  background: #dcfce7;
  color: #166534;
}

/* PRICE */
.price {
  font-size: 18px;
  font-weight: bold;
}

/* FORMS */
input, textarea, select {
  width: 100%;
  padding: 10px;
  margin-bottom: 12px;
  border-radius: 8px;
  border: 1px solid #d1d5db;
}

label {
  display: block;
  margin-bottom: 6px;
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .container {
    padding: 14px;
  }

  .card {
    padding: 16px;
    border-radius: 12px;
  }

  /* Buttons: Full width wenn wenig Platz */
  .btn, button {
    width: 100%;
    text-align: center;
  }

  /* Headline etwas kleiner */
  h1 {
    font-size: 28px;
  }

  /* Header Card: Elemente untereinander, wenn nötig */
  .card[style*="justify-content:space-between"] {
    flex-direction: column;
    align-items: flex-start !important;
  }
}

/* ===== Auth UX (Login/Register) ===== */
.auth-wrap{
  max-width: 520px;
  margin: 32px auto;
  padding: 0 14px;
}
.auth-card{
  background: #fff;
  border-radius: 16px;
  padding: 22px;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
  border: 1px solid #eef2f7;
}
.auth-title{
  font-size: 28px;
  margin: 0 0 14px 0;
  line-height: 1.15;
}
.auth-sub{
  margin: 0 0 18px 0;
  color: #6b7280;
  font-size: 14px;
}
.auth-form label{
  display:block;
  margin: 12px 0 6px 0;
  font-weight: 600;
  color: #111827;
}
.auth-form input[type="email"],
.auth-form input[type="password"],
.auth-form input[type="text"]{
  width: 100%;
  padding: 14px 14px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  font-size: 16px;
  outline: none;
}
.auth-form input:focus{
  border-color: #6366f1;
  box-shadow: 0 0 0 4px rgba(99,102,241,.12);
}
.auth-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top: 14px;
}
.auth-row input[type="checkbox"]{
  width: 18px;
  height: 18px;
}
.auth-actions{
  margin-top: 16px;
}
.auth-actions button,
.auth-actions .btn{
  width: 100%;
  padding: 14px 16px;
  border-radius: 12px;
  font-size: 16px;
}
.auth-links{
  display:flex;
  justify-content: space-between;
  margin-top: 12px;
  font-size: 13px;
}
@media (max-width: 720px){
  .auth-wrap{ margin: 18px auto; }
  .auth-title{ font-size: 26px; }
}


/* ===== Auth UX (Login/Register) ===== */
.auth-wrap{max-width:540px;margin:26px auto 0;}
.auth-card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:18px;box-shadow:0 10px 22px rgba(16,24,40,.08);}
.auth-wrap h1{margin-top:0;}
.auth-wrap label{display:block;margin:12px 0 6px;font-weight:700;color:#111827;}
.auth-wrap input[type="email"],
.auth-wrap input[type="password"],
.auth-wrap input[type="text"]{
  width:100%;
  padding:12px 14px;
  border-radius:12px;
  border:1px solid #e5e7eb;
  background:#fff;
}
.auth-wrap button{width:100%; padding:12px 14px; border-radius:12px;}
.auth-links{display:flex;justify-content:space-between;gap:10px;margin-top:10px;font-size:13px;}
@media (max-width:720px){
  .auth-wrap{max-width:92vw;}
}

/* ===== Marketplace Grid ===== */
.products-grid{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap:18px;
}

.product-card{
  background:#fff;
  border-radius:14px;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
  padding:14px;
  transition:transform .08s ease, box-shadow .15s ease;
  border:1px solid #eef2f7;
}

.product-card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(0,0,0,.08);
}

.product-card h3{
  margin:6px 0 6px;
  font-size:15px;
  line-height:1.2;
}

.product-card p{
  font-size:13px;
  color:#6b7280;
  margin:6px 0 0;
}

.product-price{
  font-weight:800;
  margin-top:10px;
  font-size:14px;
}

/* Tablet */
@media (max-width:1100px){
  .products-grid{ grid-template-columns: repeat(3, 1fr); }
}

/* Mobile */
@media (max-width:640px){
  .products-grid{ grid-template-columns: repeat(2, 1fr); gap:12px; }
  .product-card{ padding:12px; }
}

/* ===== Seller Products Grid ===== */
.seller-grid{
  display:grid;
  gap:16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1000px){
  .seller-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px){
  .seller-grid{ grid-template-columns: 1fr; }
}

.seller-product-card .meta{
  color:#6b7280;
  font-size:13px;
  margin:6px 0 0 0;
}

.seller-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}

/* ===== Seller Products Grid ===== */
.seller-grid{
  display:grid;
  gap:16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1000px){
  .seller-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px){
  .seller-grid{ grid-template-columns: 1fr; }
}

.seller-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}

/* Marketplace image card polish */
.product-card img{
  transition: transform .2s ease;
}
.product-card:hover img{
  transform: scale(1.02);
}

/* ===============================
   MIC THEME v2 – LIGHT VIOLET PREMIUM
   (better readability)
   =============================== */

body {
  background:
    radial-gradient(900px 500px at 10% -10%, #ede9fe 0%, transparent 60%),
    radial-gradient(900px 500px at 90% -10%, #e9d5ff 0%, transparent 60%),
    #f6f3ff;
  color: #111827;
}

/* Cards */
.card {
  background: #ffffff;
  border: 1px solid #ede9fe;
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(139,92,246,0.08);
  color: #111827;
}

/* Header Bar */
.site-topbar {
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(10px);
  border: 1px solid #ede9fe;
  box-shadow: 0 10px 28px rgba(139,92,246,0.12);
}

/* Navigation Buttons */
.nav a.primary {
  background: linear-gradient(135deg, #8b5cf6, #a78bfa);
  color: #fff;
  box-shadow: 0 6px 16px rgba(139,92,246,0.25);
}

.nav a.light {
  background: #f5f3ff;
  color: #6d28d9;
  border-color: #ddd6fe;
}

.nav a.dark {
  background: #111827;
  color: #fff;
}

.nav a:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
}

/* Text readability fixes */
h1, h2, h3, h4 {
  color: #111827;
}

p, .text-muted, .small {
  color: #6b7280;
}

/* Badges */
.badge {
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
  color: #6d28d9;
  font-weight: 700;
}

/* Seller / User Panels */
.profile-card,
.seller-card {
  background: #ffffff;
  border: 1px solid #ede9fe;
  box-shadow: 0 8px 24px rgba(139,92,246,0.08);
}

/* Footer */
footer,
.site-footer {
  color: #6b7280;
}



/* =========================================================
   MIC THEME v3 – BRIGHT LILAC (Premium, readable)
   (Overrides to guarantee visibility)
   ========================================================= */
:root{
  --mic-bg1:#faf5ff;
  --mic-bg2:#f5f3ff;
  --mic-bg3:#ede9fe;

  --mic-ink:#111827;
  --mic-muted:#4b5563;

  --mic-card: rgba(255,255,255,0.92);
  --mic-card-border:#e9d5ff;

  --mic-accent1:#a78bfa;
  --mic-accent2:#8b5cf6;
  --mic-accent3:#7c3aed;
}

html, body{
  background: radial-gradient(1200px 600px at 20% 0%, var(--mic-bg1), var(--mic-bg2) 45%, var(--mic-bg3) 100%) !important;
  color: var(--mic-ink) !important;
}

.site-shell{ background: transparent !important; }

.card, .profile-card, .seller-card{
  background: var(--mic-card) !important;
  border: 1px solid var(--mic-card-border) !important;
  box-shadow: 0 10px 28px rgba(139,92,246,0.14) !important;
}

h1,h2,h3,h4{ color: var(--mic-ink) !important; }
p, .text-muted, .small{ color: var(--mic-muted) !important; }

.badge{
  background: #f5f3ff !important;
  border: 1px solid #ddd6fe !important;
  color: #5b21b6 !important;
}

/* Header / Nav – heller, luxuriöser */
.site-topbar{
  background: rgba(255,255,255,0.88) !important;
  border: 1px solid #e9d5ff !important;
  box-shadow: 0 14px 34px rgba(139,92,246,0.16) !important;
}

.nav a.primary{
  background: linear-gradient(135deg, var(--mic-accent2), var(--mic-accent1)) !important;
  color:#fff !important;
  box-shadow: 0 10px 24px rgba(139,92,246,0.25) !important;
}
.nav a.light{
  background:#f5f3ff !important;
  color:#5b21b6 !important;
  border-color:#e9d5ff !important;
}
.nav a.dark{
  background:#1f2937 !important;
  color:#fff !important;
}
.nav a.danger{
  background:#ef4444 !important;
  color:#fff !important;
}

/* Better contrast for star ratings / tiny text */
span, small, .rating, .stars { color: var(--mic-ink) !important; }


/* =========================================================
   MIC THEME v4 – OG LILAC + READABILITY (darker bg, readable UI)
   (Overrides v3; keeps luxury dark lilac, fixes contrast)
   ========================================================= */
:root{
  --mic-bgA:#120826;
  --mic-bgB:#1a0b34;
  --mic-bgC:#2a0f4a;

  --mic-panel: rgba(17,24,39,0.78);
  --mic-panel-border: rgba(167,139,250,0.22);

  --mic-ink:#f9fafb;
  --mic-muted:#cbd5e1;
  --mic-soft:#e5e7eb;

  --mic-accent1:#a78bfa;
  --mic-accent2:#8b5cf6;
  --mic-accent3:#c4b5fd;
}

html, body{
  background:
    radial-gradient(900px 600px at 15% 0%, rgba(167,139,250,0.22), transparent 55%),
    radial-gradient(900px 600px at 85% 0%, rgba(139,92,246,0.18), transparent 60%),
    linear-gradient(180deg, var(--mic-bgA), var(--mic-bgB) 45%, var(--mic-bgC)) !important;
  color: var(--mic-ink) !important;
}

.site-shell{ background: transparent !important; }

/* Make generic cards readable on dark bg */
.card, .profile-card, .seller-card{
  background: var(--mic-panel) !important;
  border: 1px solid var(--mic-panel-border) !important;
  box-shadow: 0 18px 44px rgba(0,0,0,0.35) !important;
  backdrop-filter: blur(10px);
}

/* Headings / text */
h1,h2,h3,h4{ color: var(--mic-ink) !important; }
p, .text-muted, .small{ color: var(--mic-muted) !important; }

/* Links */
a{ color: var(--mic-accent3) !important; }
a:hover{ color: #ffffff !important; }

/* Badges: readable on dark */
.badge{
  background: rgba(167,139,250,0.18) !important;
  border: 1px solid rgba(167,139,250,0.35) !important;
  color: #ffffff !important;
  font-weight: 800 !important;
}

/* Nav / Header: keep OG dark glass */
.site-topbar{
  background: rgba(17,24,39,0.74) !important;
  border: 1px solid rgba(167,139,250,0.22) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,0.40) !important;
  backdrop-filter: blur(12px);
}

.nav a.primary{
  background: linear-gradient(135deg, var(--mic-accent2), var(--mic-accent1)) !important;
  color:#fff !important;
  box-shadow: 0 10px 24px rgba(139,92,246,0.28) !important;
}
.nav a.light{
  background: rgba(167,139,250,0.16) !important;
  color:#fff !important;
  border-color: rgba(167,139,250,0.30) !important;
}
.nav a.dark{
  background: rgba(17,24,39,0.92) !important;
  color:#fff !important;
  border-color: rgba(167,139,250,0.18) !important;
}
.nav a.danger{
  background:#ef4444 !important;
  color:#fff !important;
}

/* Ratings / tiny meta text */
.rating, .stars, .star, .meta, .date, .muted, small, span{
  color: var(--mic-soft) !important;
}

/* =====================================================================
   MIC READABILITY PATCH v3 – Lux Violet (Contrast + Auth Card Fix)
   - Fixes: badges readability, small text, stars/reviews, login card
   - Safe: no DB, only CSS, scoped where possible
===================================================================== */

/* Global text defaults on dark UI surfaces */
.site-topbar, .profile-card, .seller-card, .card {
  color: #f8fafc;
}

/* Headings inside dark surfaces */
.site-topbar h1, .site-topbar h2, .site-topbar h3,
.profile-card h1, .profile-card h2, .profile-card h3,
.seller-card h1, .seller-card h2, .seller-card h3,
.card h1, .card h2, .card h3 {
  color: #f8fafc;
}

/* Muted text on dark surfaces */
.site-topbar .text-muted, .site-topbar .small,
.profile-card .text-muted, .profile-card .small,
.seller-card .text-muted, .seller-card .small,
.card .text-muted, .card .small,
.card small, .card p {
  color: rgba(226,232,240,0.82);
}

/* Make borders a touch clearer */
.site-topbar, .profile-card, .seller-card, .card {
  border-color: rgba(167,139,250,0.28) !important;
}

/* BADGES: readable on dark backgrounds */
.badge {
  background: rgba(255,255,255,0.12) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  color: #f8fafc !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.25);
}

/* Badge variants (if you use them anywhere) */
.badge.success { background: rgba(16,185,129,0.18) !important; border-color: rgba(16,185,129,0.35) !important; }
.badge.warn    { background: rgba(245,158,11,0.18) !important; border-color: rgba(245,158,11,0.35) !important; }
.badge.purple  { background: rgba(167,139,250,0.22) !important; border-color: rgba(167,139,250,0.40) !important; }

/* Links: brighter */
a { color: #ddd6fe; }
a:hover { color: #f5f3ff; }

/* Stars / rating text: brighter */
.star, .stars, .rating, .review, .review * {
  color: #f8fafc;
}
.review .date, .review-date, .review small {
  color: rgba(226,232,240,0.75);
}

/* Inputs default (dark UI) */
input, select, textarea {
  background: rgba(15,23,42,0.85) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  color: #f8fafc !important;
}
input::placeholder, textarea::placeholder {
  color: rgba(199,210,254,0.85) !important;
}

/* BUTTONS (generic) – help when pages use plain .btn */
.btn, button, input[type="submit"] {
  color: #fff;
}
.btn.light {
  color: #111827 !important;
}

/* Marketplace product cards: keep readable (light surface) */
.product-card {
  background: rgba(255,255,255,0.96) !important;
  color: #111827 !important;
}
.product-card * { color: inherit; }
.product-card .badge {
  background: rgba(124,58,237,0.10) !important;
  border-color: rgba(124,58,237,0.18) !important;
  color: #5b21b6 !important;
  text-shadow: none !important;
}
.product-card .price { color: #7c3aed !important; font-weight: 900 !important; }
.product-card .seller { color: #6b7280 !important; }

/* AUTH CARD (login/register): when the container has class="auth-card" */
.auth-card, .card.auth-card {
  background: rgba(255,255,255,0.96) !important;
  color: #111827 !important;
  border: 1px solid rgba(221,214,254,0.9) !important;
}
.auth-card h1, .auth-card h2, .auth-card h3,
.auth-card label, .auth-card p, .auth-card small {
  color: #111827 !important;
}
.auth-card .text-muted, .auth-card .small, .auth-card small {
  color: rgba(17,24,39,0.70) !important;
}
.auth-card input, .auth-card select, .auth-card textarea {
  background: #fff !important;
  border: 1px solid rgba(17,24,39,0.16) !important;
  color: #111827 !important;
}
.auth-card input::placeholder, .auth-card textarea::placeholder {
  color: rgba(17,24,39,0.45) !important;
}

/* Footer links: clearer on violet background */
.site-footer, footer {
  color: rgba(226,232,240,0.80) !important;
}
.site-footer a, footer a {
  color: #e9d5ff !important;
  text-decoration: none;
}
.site-footer a:hover, footer a:hover {
  color: #ffffff !important;
  text-decoration: underline;
}

/* -----------------------------------------------------
   MIC BADGE/TYPE BOOST – v3.1 (readability hotfix)
   (safe overrides for badges/ratings/muted text)
----------------------------------------------------- */
.text-muted, .muted, .small, small,
.card small, .card .small, .card .text-muted {
  color: rgba(241,245,249,0.78) !important;
}

/* Common badge-like elements */
.badge, .pill, .tag, .chip, .label,
.status, .status-badge, .count-badge {
  color: #f8fafc !important;
  background: rgba(167,139,250,0.22) !important;
  border: 1px solid rgba(167,139,250,0.42) !important;
  font-weight: 800 !important;
}

/* Light badges that were too washed out */
.badge.light, .badge-soft, .badge-muted {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,255,255,0.20) !important;
  color: #f8fafc !important;
}

/* Rating blocks / stars (generic) */
.rating, .stars, .review, .review-card {
  color: #f8fafc !important;
}
.rating small, .review small {
  color: rgba(241,245,249,0.72) !important;
}

/* Ensure card text is readable on dark surfaces */
.card, .profile-card, .seller-card {
  color: #f8fafc;
}

/* === MIC READABILITY PATCH v5 – Targeted Badges (marketplace + seller-profile + user) === */

/* A) DARK SURFACES: make inline-styled badges readable (seller-profile.php + user.php) */
.card .badge,
.profile-card .badge,
.seller-card .badge,
.panel .badge {
  background: rgba(255,255,255,0.12) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  color: rgba(255,255,255,0.92) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.25) !important;
  font-weight: 900 !important;
}

/* ratings / stars inside dark surfaces */
.card .sp-stars,
.profile-card .sp-stars,
.seller-card .sp-stars {
  color: rgba(255,255,255,0.92) !important;
  opacity: 1 !important;
}

.card .sp-rating,
.profile-card .sp-rating,
.seller-card .sp-rating {
  color: rgba(255,255,255,0.85) !important;
}

/* verified name highlight */
.sp-name.verified {
  color: rgba(255,255,255,0.96) !important;
}

/* B) MARKETPLACE: keep product cards crisp + fix local pills */
.product-card.verified-card{
  border: 1px solid rgba(167,139,250,0.55) !important;
  box-shadow: 0 10px 26px rgba(139,92,246,0.16) !important;
}

.badge-verified-strong{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:13px;
  line-height:1;
}

/* default: on DARK surfaces (seller-profile) */
.card .badge-verified-strong,
.profile-card .badge-verified-strong,
.seller-card .badge-verified-strong,
.panel .badge-verified-strong{
  background: rgba(16,185,129,0.18) !important;
  border: 1px solid rgba(16,185,129,0.35) !important;
  color: rgba(236,253,245,0.98) !important;
}

/* inside WHITE product cards */
.product-card .badge-verified-strong{
  background:#ecfdf5 !important;
  border:1px solid #a7f3d0 !important;
  color:#065f46 !important;
  box-shadow:none !important;
}

/* "Neue Produkte verfügbar" pill */
.mp-pill{
  background: #f5f3ff !important;
  border: 1px solid #c4b5fd !important;
  color: #4c1d95 !important;
  font-weight: 900 !important;
}

/* ensure other pills/chips in product cards are readable */
.product-card .badge,
.product-card .pill,
.product-card .chip,
.product-card .tag{
  background:#f5f3ff !important;
  border:1px solid #c4b5fd !important;
  color:#4c1d95 !important;
  box-shadow:none !important;
}

/* C) HEADER BUTTON TEXT readability */
.site-topbar .nav a{
  text-shadow: 0 1px 0 rgba(0,0,0,0.25);
}

/* === /MIC READABILITY PATCH v5 === */

/* === MIC BADGE SYSTEM v1 – unified pills (no inline styles) === */
.badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:13px;
  line-height:1;
  border:1px solid transparent;
  box-shadow:none;
}

.badge-neutral{
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.18);
  color:#f8fafc;
}

.badge-dark{
  background: rgba(17,24,39,0.85);
  border-color: rgba(255,255,255,0.15);
  color:#ffffff;
}

.badge-success{
  background: rgba(16,185,129,0.18);
  border-color: rgba(167,243,208,0.35);
  color:#d1fae5;
}

.badge-info{
  background: rgba(59,130,246,0.18);
  border-color: rgba(147,197,253,0.35);
  color:#dbeafe;
}

.badge-violet{
  background: rgba(167,139,250,0.18);
  border-color: rgba(196,181,253,0.40);
  color:#f3e8ff;
}

.badge-warm{
  background: rgba(251,146,60,0.18);
  border-color: rgba(254,215,170,0.35);
  color:#ffedd5;
}

/* Make badges readable on dark cards (seller/user pages) */
.profile-card .badge,
.seller-card .badge{
  text-shadow: 0 1px 0 rgba(0,0,0,0.35);
}
/* === /MIC BADGE SYSTEM v1 === */


/* =====================================================
   MIC GLOBAL READABILITY v1
   Premium contrast for Marketplace / Seller / User
   ===================================================== */

/* --- 1. CARD SURFACE (alle Karten einheitlich) --- */
.card,
.product-card,
.profile-card,
.seller-card {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 8px 22px rgba(0,0,0,0.05) !important;
}

/* Card Text */
.card p,
.card span,
.card div,
.product-card p,
.profile-card p,
.seller-card p {
  color: #374151 !important;
}

/* Muted Text */
.text-muted,
.small,
.card small {
  color: #6b7280 !important;
}

/* --- 2. HEADLINES --- */
.card h1,
.card h2,
.card h3,
.product-card h3,
.profile-card h2,
.seller-card h2 {
  color: #111827 !important;
  font-weight: 800;
}

/* --- 3. BUTTON SYSTEM --- */
.btn,
button,
.nav a {
  font-weight: 800 !important;
  letter-spacing: 0.2px;
}

/* Primary (Lila) */
.btn.primary,
.nav a.primary {
  background: linear-gradient(135deg, #8b5cf6, #a78bfa) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 6px 16px rgba(139,92,246,0.25) !important;
}

/* Light Buttons */
.btn.light,
.nav a.light {
  background: #f5f3ff !important;
  color: #4c1d95 !important;
  border: 1px solid #ddd6fe !important;
}

/* Dark Buttons */
.btn.dark,
.nav a.dark {
  background: #111827 !important;
  color: #ffffff !important;
}

/* --- 4. BADGE SYSTEM (forced contrast) --- */
.badge {
  background: #f5f3ff !important;
  border: 1px solid #c4b5fd !important;
  color: #4c1d95 !important;
  font-weight: 900 !important;
}

/* Verified */
.badge-verified-strong {
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
  color: #065f46 !important;
}

/* Rating badge (dark) */
.badge.rating,
.badge-dark {
  background: #111827 !important;
  color: #ffffff !important;
}

/* --- 5. LINKS --- */
a {
  color: #7c3aed;
  font-weight: 600;
}
a:hover {
  color: #6d28d9;
}

/* --- 6. FORMS --- */
input,
select,
textarea {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
}

/* =====================================================
   /MIC GLOBAL READABILITY v1
   ===================================================== */

/* === MIC READABILITY PATCH v6 – Headings + Marketplace Badges Contrast === */

/* ---------------------------
   A) GLOBAL: Dark theme readability
   --------------------------- */
body {
  color: #e5e7eb;
}

h1, h2, h3, h4, .page-title, .page-title h1 {
  color: #f8fafc;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35);
}

/* User/Seller "Name" auf Profilseiten (falls als Headline/Link gerendert) */
.seller-card h1, .seller-card h2, .seller-card .sp-name,
.profile-card h1, .profile-card h2, .profile-card .user-name,
.card h1, .card h2 {
  color: #f8fafc;
}

/* Links auf dark surfaces etwas heller */
.site-shell a {
  color: #ddd6fe;
}
.site-shell a:hover {
  color: #f5f3ff;
}

/* ---------------------------
   B) KEEP white surfaces readable (Marketplace cards, Auth)
   --------------------------- */
.product-card,
.product-card * {
  color: inherit;
}
.product-card {
  background: #ffffff;
  color: #111827;
}
.product-card h1, .product-card h2, .product-card h3, .product-card h4 {
  color: #111827;
  text-shadow: none;
}

.auth-card {
  color: #111827;
}
.auth-card h1, .auth-card h2, .auth-card h3 {
  color: #111827;
  text-shadow: none;
}

/* ---------------------------
   C) MARKETPLACE: badges/pills inside product cards must be high-contrast
   --------------------------- */
.product-card .badge,
.product-card .pill,
.product-card .chip,
.product-card .tag,
.product-card .mp-pill {
  background: #f5f3ff !important;
  border: 1px solid #c4b5fd !important;
  color: #4c1d95 !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}

.product-card .badge-verified-strong,
.product-card .verified-badge,
.product-card .badge-verified {
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
  color: #065f46 !important;
  font-weight: 900 !important;
}

.product-card .price {
  color: #6d28d9;
  font-weight: 900;
}

/* "Beliebt"/Highlight Badge (falls du irgendwo #fff7ed / #fed7aa nutzt) */
.product-card .badge.hot,
.product-card .badge-popular {
  background: #fff7ed !important;
  border: 1px solid #fed7aa !important;
  color: #9a3412 !important;
}

/* ---------------------------
   D) Dark cards: badges dürfen bleiben, aber mehr Kontrast
   --------------------------- */
.profile-card .badge,
.seller-card .badge,
.card .badge {
  background: rgba(167,139,250,0.18) !important;
  border: 1px solid rgba(167,139,250,0.40) !important;
  color: #f5f3ff !important;
  font-weight: 900 !important;
}

/* === /MIC READABILITY PATCH v6 === */


/* === MIC TEXT SYSTEM v1 – reusable text colors === */
.text-on-dark { color:#f8fafc !important; }
.text-muted-on-dark { color: rgba(248,250,252,0.72) !important; }
.text-on-light { color:#111827 !important; }
.text-muted-on-light { color:#6b7280 !important; }
/* === /MIC TEXT SYSTEM v1 === */

/* === MIC READABILITY PATCH v7 – Headings + Names + Premium Badges === */

/* ---- A) Global readable headings on DARK glass surfaces ---- */
/* Keep auth cards unchanged (white surface), and keep marketplace product cards (white) readable. */
.site-shell :is(h1,h2,h3,h4),
.site-shell .page-title,
.site-shell .title,
.site-shell .headline{
  color: #f8fafc !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35);
}

/* Username / Seller names often sit inside custom blocks – force them bright */
.site-shell :is(.sp-name,.seller-name,.user-name,.profile-name,.profile-title){
  color: #f8fafc !important;
}

/* If a username is rendered as plain text inside a header block */
.site-shell .profile-header :is(h1,h2,h3),
.site-shell .seller-header  :is(h1,h2,h3){
  color: #f8fafc !important;
}

/* Muted text on dark surfaces */
.site-shell :is(p,.muted,.text-muted,.small,.hint,.subline){
  color: rgba(226,232,240,0.80) !important; /* slate-200 */
}

/* ---- B) Seller-profile / user-profile review text readability ---- */
.site-shell .sp-review,
.site-shell .review,
.site-shell .rating-row,
.site-shell .sp-bio,
.site-shell .bio,
.site-shell .meta,
.site-shell .sp-meta{
  color: rgba(241,245,249,0.92) !important; /* near-white */
}

.site-shell .sp-review small,
.site-shell .review small,
.site-shell .meta small,
.site-shell .date,
.site-shell .timestamp{
  color: rgba(226,232,240,0.75) !important;
}

/* Stars line / score */
.site-shell .sp-stars,
.site-shell .stars{
  color: #e9d5ff !important;
}

/* ---- C) Header/Nav readability (text was “dark thread” across site) ---- */
.site-topbar,
.site-topbar *{
  color: rgba(248,250,252,0.95) !important;
}

.site-topbar .nav a{
  color: rgba(248,250,252,0.95) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35);
}

.site-topbar .nav a.primary{
  color:#fff !important;
}

/* ---- D) Marketplace: premium badge/pill system (stronger, not washed out) ---- */

/* Product cards are white – keep their headings dark */
.product-card :is(h1,h2,h3,h4,.title){
  color:#0f172a !important;
}

/* Default badge on DARK surfaces (user/seller pages) */
.site-shell .badge{
  background: rgba(124,58,237,0.18) !important;  /* violet */
  border: 1px solid rgba(196,181,253,0.45) !important;
  color: #f8fafc !important;
  font-weight: 800 !important;
}

/* Marketplace product-card badges/pills */
.product-card .badge,
.product-card .pill,
.product-card .chip,
.product-card .tag{
  background: #f5f3ff !important;
  border: 1px solid #c4b5fd !important;
  color: #4c1d95 !important;
  font-weight: 900 !important;
}

/* Verified badge (green but readable) */
.badge-verified-strong,
.product-card .badge-verified-strong{
  background: #ecfdf5 !important;
  border: 1px solid #6ee7b7 !important;
  color: #065f46 !important;
  font-weight: 900 !important;
}

/* “Neue Produkte verfügbar” pill */
.mp-pill{
  background: linear-gradient(135deg, #ede9fe, #f5f3ff) !important;
  border: 1px solid #a78bfa !important;
  color: #4c1d95 !important;
  font-weight: 900 !important;
}

/* Special marketplace badges (Beliebt/Neu) – if they use generic .badge */
.product-card .badge.hot,
.product-card .badge.popular,
.product-card .badge--hot{
  background:#fff7ed !important;
  border:1px solid #fdba74 !important;
  color:#9a3412 !important;
}

.product-card .badge.new,
.product-card .badge--new{
  background:#eff6ff !important;
  border:1px solid #93c5fd !important;
  color:#1e40af !important;
}

/* Make tiny label texts in marketplace filter area readable */
#marketplace-filters,
#marketplace-filters *{
  color: rgba(241,245,249,0.90) !important;
}

/* ---- E) Do NOT touch auth card typography (keep sexy white auth) ---- */
.auth-card :is(h1,h2,h3,h4),
.auth-card .title{
  color:#111827 !important;
  text-shadow:none !important;
}
.auth-card :is(p,.muted,.text-muted,.small,.hint){
  color:#6b7280 !important;
}

/* === /MIC READABILITY PATCH v7 === */



/* =====================================================
   MIC SURFACE PATCH v8 – Dark Surfaces + Content Fix
   Marketplace Cards, Forms, Legal Pages
   ===================================================== */

/* === 1) MARKETPLACE CARDS – no white flash === */
.product-card{
  background: linear-gradient(180deg, #0f172a 0%, #0b1224 100%) !important;
  border: 1px solid rgba(139,92,246,0.25) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,0.45) !important;
  color:#e9d5ff !important;
}

.product-card:hover{
  border-color: rgba(167,139,250,0.6) !important;
  transform: translateY(-2px);
}

/* card text */
.product-card h3,
.product-card h4,
.product-card strong{
  color:#f5f3ff !important;
}

.product-card small,
.product-card .meta,
.product-card .seller{
  color:#c4b5fd !important;
}

/* image placeholder */
.product-card .no-image{
  background:#0b1224 !important;
  color:#a78bfa !important;
}

/* === 2) FORMS (seller/new-product etc.) === */
form label{
  color:#c4b5fd !important;
  font-weight:600;
}

form input,
form select,
form textarea{
  background:#0b1224 !important;
  border:1px solid rgba(139,92,246,0.3) !important;
  color:#f5f3ff !important;
}

form input::placeholder,
form textarea::placeholder{
  color:#8b5cf6 !important;
}

form input:focus,
form select:focus,
form textarea:focus{
  border-color:#a78bfa !important;
  box-shadow:0 0 0 2px rgba(167,139,250,0.25);
}

/* === 3) LEGAL PAGES (AGB / Datenschutz / Impressum) === */
.legal-content,
.legal-content p,
.legal-content li,
.legal-content span,
.legal-content div{
  color:#e9d5ff !important;
}

.legal-content h1,
.legal-content h2,
.legal-content h3{
  color:#f5f3ff !important;
}

.legal-content a{
  color:#a78bfa !important;
}

/* fallback if no wrapper */
body p,
body li{
  color:#e9d5ff;
}

/* === 4) GENERIC DARK TEXT KILLER === */
[style*="color:#111827"],
[style*="color:#374151"],
[style*="color:#000"],
[style*="color:black"]{
  color:#e9d5ff !important;
}

/* === /MIC SURFACE PATCH v8 === */



/* =====================================================
   MIC PREMIUM MODE v9 – Glass + Titles + Badge Pop
   ===================================================== */

/* smooth premium motion */
.product-card,
.site-topbar,
.profile-card,
.seller-card,
.auth-card,
.panel,
.card{
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}

/* ---------- A) Marketplace card title readability ---------- */
.product-card h1,
.product-card h2,
.product-card h3,
.product-card h4,
.product-card .title,
.product-card .product-title,
.product-card .product-name{
  color:#ffffff !important;
  text-shadow: 0 2px 10px rgba(0,0,0,0.55) !important;
  font-weight: 900 !important;
}

/* make description text readable on dark cards */
.product-card p,
.product-card .desc,
.product-card .description{
  color:#e9d5ff !important;
}

/* ---------- B) Marketplace badges (Beliebt/Neu + all pills) ---------- */
.product-card .badge,
.product-card .pill,
.product-card .chip,
.product-card .tag{
  background: rgba(167,139,250,0.22) !important;
  border: 1px solid rgba(167,139,250,0.55) !important;
  color: #f5f3ff !important;
  font-weight: 900 !important;
  box-shadow: 0 8px 18px rgba(0,0,0,0.35) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

/* extra pop for emoji badges like 🔥 / Neu */
.product-card .badge{
  padding: 6px 10px !important;
  border-radius: 999px !important;
  letter-spacing: .2px !important;
}

/* Verified badge stays premium */
.product-card .badge-verified-strong{
  background: rgba(16,185,129,0.18) !important;
  border: 1px solid rgba(167,243,208,0.6) !important;
  color: #ecfdf5 !important;
}

/* ---------- C) Premium glass surface (subtle) ---------- */
.site-topbar,
.profile-card,
.seller-card,
.panel,
.card{
  background: rgba(15,23,42,0.82) !important;
  border: 1px solid rgba(139,92,246,0.28) !important;
  backdrop-filter: blur(10px);
  box-shadow: 0 14px 34px rgba(0,0,0,0.45) !important;
}

.site-topbar:hover,
.profile-card:hover,
.seller-card:hover{
  border-color: rgba(167,139,250,0.55) !important;
}

/* ---------- D) Buttons a bit more premium ---------- */
button,
.btn,
a.btn{
  box-shadow: 0 10px 22px rgba(0,0,0,0.35);
}

button:hover,
.btn:hover,
a.btn:hover{
  transform: translateY(-1px);
}

/* === /MIC PREMIUM MODE v9 === */



/* =====================================================
   MIC PREMIUM MODE v9.1 – Marketplace Titles + Badge Colors
   ===================================================== */

/* Marketplace cards: keep dark premium surface (no white pain) */
.product-card{
  background: rgba(15,23,42,0.88) !important;
  border: 1px solid rgba(167,139,250,0.28) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,0.45) !important;
  color: #e5e7eb !important;
}

/* Product title (fix “black title”) */
.product-card .product-title,
.product-card .title,
.product-card h3,
.product-card h4,
.product-card strong{
  color:#e9d5ff !important;
  font-weight: 900 !important;
  text-shadow: 0 2px 10px rgba(0,0,0,0.55) !important;
}

/* If any inline dark colors survive, override */
.product-card [style*="color:#111827"],
.product-card [style*="color:#1f2937"],
.product-card [style*="color:#374151"],
.product-card [style*="color:#000"]{
  color:#e9d5ff !important;
}

/* Badge base */
.product-card .badge{
  padding: 6px 10px !important;
  border-radius: 999px !important;
  font-weight: 900 !important;
  letter-spacing: .2px !important;
  box-shadow: 0 8px 18px rgba(0,0,0,0.35) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

/* Beliebt = red */
.product-card .badge-popular{
  background: rgba(239,68,68,0.22) !important;
  border: 1px solid rgba(239,68,68,0.55) !important;
  color: #fff1f2 !important;
}

/* Neu = soft blue */
.product-card .badge-new{
  background: rgba(59,130,246,0.22) !important;
  border: 1px solid rgba(59,130,246,0.55) !important;
  color: #eff6ff !important;
}

/* Generic tags (Videos/Digital/Custom etc.) */
.product-card .badge-tag{
  background:#f5f3ff !important;
  border:1px solid #c4b5fd !important;
  color:#4c1d95 !important;
}

/* Verified stays green (already exists, but reinforce) */
.product-card .badge-verified-strong{
  background: rgba(16,185,129,0.18) !important;
  border: 1px solid rgba(167,243,208,0.6) !important;
  color: #ecfdf5 !important;
}

/* === /MIC PREMIUM MODE v9.1 === */



/* =====================================================
   MIC PREMIUM MODE v9.2 – No-Image Placeholder + Glow Unify
   ===================================================== */

/* A) Kill bright placeholder blocks inside marketplace cards */
.product-card :where([style*="background:#fff"], [style*="background: #fff"],
                     [style*="background:#ffffff"], [style*="background: #ffffff"],
                     [style*="background:#f3f4f6"], [style*="background: #f3f4f6"],
                     [style*="background:#f9fafb"], [style*="background: #f9fafb"],
                     [style*="background:#f8fafc"], [style*="background: #f8fafc"]){
  background: rgba(15,23,42,0.60) !important;
}

/* B) Typical “no image / placeholder” class names (covers most templates) */
.product-card :where(.no-image, .noimg, .no-img, .placeholder, .img-placeholder, .image-placeholder,
                     .product-thumb, .thumb, .thumb-wrap, .image-wrap, .product-image, .product-image-wrap){
  background: linear-gradient(180deg, rgba(15,23,42,0.62), rgba(2,6,23,0.30)) !important;
  border-bottom: 1px solid rgba(167,139,250,0.20) !important;
}

/* C) If the top “image area” is just the first child block, make it premium too */
.product-card > :first-child{
  background: linear-gradient(180deg, rgba(15,23,42,0.62), rgba(2,6,23,0.30)) !important;
}

/* D) “Kein Bild” text: readable + premium */
.product-card :where(.no-image, .noimg, .no-img, .placeholder, .img-placeholder, .image-placeholder) :where(*){
  color: #c4b5fd !important;
  font-weight: 900 !important;
  text-shadow: 0 2px 10px rgba(0,0,0,0.55) !important;
}

/* E) Marketplace titles (extra hard override – catches plain div/p spans) */
.product-card :where(.product-name, .name, .headline, .card-title){
  color:#e9d5ff !important;
  font-weight: 900 !important;
}

/* F) Unify “glow” so cards with/without images look consistent */
.product-card{
  box-shadow:
    0 18px 44px rgba(0,0,0,0.50),
    0 0 0 1px rgba(167,139,250,0.22) inset !important;
}

/* === /MIC PREMIUM MODE v9.2 === */



/* =====================================================
   MIC PREMIUM MODE v9.3 – Marketplace Cleanup (titles + noimg + meta)
   ===================================================== */

.product-card .mp-title{
  margin:0 0 8px 0 !important;
  color:#e9d5ff !important;         /* premium lilac */
  font-weight:900 !important;
  letter-spacing:0.2px;
  text-shadow:0 2px 14px rgba(0,0,0,.55);
}

.product-card .mp-desc{
  margin:0 !important;
  color: rgba(255,255,255,0.82) !important;
  font-size:13px !important;
  line-height:1.35 !important;
}

.product-card .mp-noimg{
  width:100% !important;
  height:190px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background: linear-gradient(180deg, rgba(15,23,42,0.68), rgba(2,6,23,0.35)) !important;
  color:#c4b5fd !important;
  font-weight:900 !important;
  border-bottom:1px solid rgba(167,139,250,0.20) !important;
  text-shadow:0 2px 12px rgba(0,0,0,.55) !important;
}

.product-card .mp-badgerow{
  margin-top:6px !important;
}

.product-card .mp-popmeta{
  font-size:12px !important;
  color: rgba(255,255,255,0.75) !important;
}

/* ensure seller line is readable */
.product-card p:last-of-type{
  color: rgba(255,255,255,0.78) !important;
}

/* === /MIC PREMIUM MODE v9.3 === */



/* =====================================================
   MIC PREMIUM MODE v9.4 – Uniform Card Glow (marketplace)
   ===================================================== */

/* Base product card surface + glow (ALL cards) */
.products-grid .product-card{
  background: rgba(10,16,32,0.68) !important;
  border: 1px solid rgba(167,139,250,0.20) !important;
  box-shadow:
    0 14px 44px rgba(0,0,0,0.55),
    0 0 0 1px rgba(167,139,250,0.12) inset !important;
  backdrop-filter: blur(10px);
}

/* Same glow on hover (a bit stronger but consistent) */
.products-grid .product-card:hover{
  border-color: rgba(167,139,250,0.34) !important;
  box-shadow:
    0 18px 56px rgba(0,0,0,0.62),
    0 0 0 1px rgba(167,139,250,0.18) inset,
    0 0 22px rgba(167,139,250,0.18) !important;
  transform: translateY(-1px);
}

/* Verified: subtle accent only (not a different card) */
.products-grid .product-card.verified-card{
  border-color: rgba(52,211,153,0.26) !important;
  box-shadow:
    0 14px 44px rgba(0,0,0,0.55),
    0 0 0 1px rgba(52,211,153,0.14) inset !important;
}

/* unify "Kein Bild" block edge so it doesn't look like a separate card */
.products-grid .product-card img,
.products-grid .product-card .mp-noimg{
  border-bottom: 1px solid rgba(167,139,250,0.16) !important;
}

/* === /MIC PREMIUM MODE v9.4 === */

/* === MIC TRUSTBAR v10.1 – Marketplace Trust Bar === */
.mp-trustbar{
  margin: 10px 0 16px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  font-weight:800;
  color: rgba(255,255,255,0.92);
  text-shadow: 0 1px 0 rgba(0,0,0,0.25);
}
.mp-trustitem{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(17,24,39,0.35);
  border: 1px solid rgba(167,139,250,0.25);
  backdrop-filter: blur(10px);
}
/* === /MIC TRUSTBAR v10.1 === */



/* ===== MOBILE TAP AREA IMPROVEMENT ===== */
@media (max-width: 720px){

  /* Buttons größer klickbar */
  .btn,
  .nav a,
  button,
  input[type="submit"]{
    min-height: 44px;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  /* Produktkarten CTA */
  .product-card a{
    min-height: 44px;
  }

}