/* ============================================================
   MidasKlub — Light Theme
   Inspirado en dotmarket.eu / Flippa / Deale
   ============================================================ */

/* ── Paleta ───────────────────────────────────────────────── */
:root {
  --mk-bg:       #F7F8FA;
  --mk-white:    #FFFFFF;
  --mk-border:   #E4E7EF;
  --mk-border-2: #D1D5DB;
  --mk-text:     #111827;
  --mk-text-2:   #374151;
  --mk-text-3:   #6B7280;
  --mk-text-4:   #9CA3AF;
  --mk-gold:     #B07D2C;
  --mk-gold-2:   #8B6020;
  --mk-gold-bg:  #FEF3E2;
  --mk-navy:     #111827;
  --mk-green:    #059669;
  --mk-shadow:   0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
  --mk-shadow-md:0 4px 12px rgba(0,0,0,0.08);
  --mk-shadow-lg:0 10px 30px rgba(0,0,0,0.10);
}

/* ── Reset base dark → light ──────────────────────────────── */
*, body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}
body {
  background: var(--mk-bg) !important;
  color: var(--mk-text) !important;
}

/* ── Nav ──────────────────────────────────────────────────── */
nav {
  background: rgba(255,255,255,0.98) !important;
  border-bottom-color: var(--mk-border) !important;
  box-shadow: 0 1px 0 var(--mk-border) !important;
  backdrop-filter: blur(20px) !important;
}
nav a, nav span, nav div { color: var(--mk-text-2) !important; }
nav a:hover { color: var(--mk-text) !important; }

/* ── Backgrounds ──────────────────────────────────────────── */
.gradient-hero,
[class*="gradient-hero"] {
  background: linear-gradient(135deg, #FFFFFF 0%, #F0F4FF 100%) !important;
}
.gradient-card,
[class*="gradient-card"] {
  background: var(--mk-white) !important;
  border-color: var(--mk-border) !important;
  box-shadow: var(--mk-shadow-md) !important;
}
[style*="0A1628"],[style*="0F2040"],[style*="162952"] {
  background: var(--mk-white) !important;
}

/* ── Sidebar ──────────────────────────────────────────────── */
.sidebar {
  background: var(--mk-white) !important;
  border-right: 1px solid var(--mk-border) !important;
  box-shadow: 1px 0 0 var(--mk-border) !important;
}
.nav-item { color: var(--mk-text-3) !important; }
.nav-item:hover { color: var(--mk-text) !important; background: var(--mk-bg) !important; }
.nav-item.active { color: var(--mk-gold) !important; background: var(--mk-gold-bg) !important; }
[class*="text-slate-700"] { color: var(--mk-text-4) !important; }

/* ── Text ─────────────────────────────────────────────────── */
.text-white, h1, h2, h3, h4, h5, h6,
[class*="font-black"], [class*="font-bold"] {
  color: var(--mk-text) !important;
}
.text-slate-300 { color: var(--mk-text-2) !important; }
.text-slate-400 { color: var(--mk-text-3) !important; }
.text-slate-500, .text-slate-600 { color: var(--mk-text-4) !important; }
[style*="color: #D4A853"],[style*="color:#D4A853"],
[style*="color: #E4B96B"],[style*="color:#E4B96B"] {
  color: var(--mk-gold) !important;
}
.text-yellow-400 { color: var(--mk-gold) !important; }

/* ── Inputs ───────────────────────────────────────────────── */
.input-field {
  background: var(--mk-white) !important;
  border: 1px solid var(--mk-border) !important;
  color: var(--mk-text) !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.04) !important;
}
.input-field:focus {
  border-color: var(--mk-gold) !important;
  background: var(--mk-white) !important;
  box-shadow: 0 0 0 3px rgba(176,125,44,0.12) !important;
  outline: none !important;
}
.input-field::placeholder { color: var(--mk-text-4) !important; }
select.input-field option { background: #FFFFFF; color: var(--mk-text); }

/* ── Buttons ──────────────────────────────────────────────── */
.btn-gold {
  background: linear-gradient(135deg, #B07D2C, #8B6020) !important;
  color: #FFFFFF !important;
  box-shadow: 0 2px 8px rgba(176,125,44,0.25) !important;
}
.btn-gold:hover {
  background: linear-gradient(135deg, #C48A30, #B07D2C) !important;
  box-shadow: 0 4px 16px rgba(176,125,44,0.35) !important;
  transform: translateY(-1px) !important;
}
.btn-outline {
  border: 2px solid rgba(176,125,44,0.4) !important;
  color: var(--mk-gold) !important;
  background: transparent !important;
}
.btn-outline:hover { background: var(--mk-gold-bg) !important; }

/* ── Cards ────────────────────────────────────────────────── */
.plan-card {
  background: var(--mk-white) !important;
  border-color: var(--mk-border) !important;
}
.plan-card:hover {
  border-color: var(--mk-gold) !important;
  box-shadow: var(--mk-shadow-lg) !important;
  transform: translateY(-4px) !important;
}
.plan-featured { border-color: var(--mk-gold) !important; }

.role-card, .type-card {
  background: var(--mk-white) !important;
  border: 2px solid var(--mk-border) !important;
  box-shadow: var(--mk-shadow) !important;
}
.role-card:hover, .type-card:hover {
  border-color: var(--mk-gold) !important;
  box-shadow: 0 4px 16px rgba(176,125,44,0.12) !important;
}
.role-card.selected, .type-card.selected {
  border-color: var(--mk-gold) !important;
  background: var(--mk-gold-bg) !important;
}

.stat-card {
  background: var(--mk-white) !important;
  border: 1px solid var(--mk-border) !important;
  box-shadow: var(--mk-shadow) !important;
}

/* ── Borders & dividers ───────────────────────────────────── */
[class*="border-white/"],
[class*="border-white\\/"] {
  border-color: var(--mk-border) !important;
}
.border-b { border-bottom-color: var(--mk-border) !important; }
[class*="h-px"] { background: var(--mk-border) !important; }
.step-line { background: var(--mk-border) !important; }
.step-line.done { background: var(--mk-green) !important; }

/* ── Step indicators ──────────────────────────────────────── */
.step-indicator.pending,
.step-num.step-pending { background: var(--mk-border) !important; color: var(--mk-text-4) !important; }
.step-indicator.active,
.step-num.step-active  { background: var(--mk-gold) !important; color: #fff !important; }
.step-indicator.done,
.step-num.step-done    { background: var(--mk-green) !important; color: #fff !important; }

/* ── Badges ───────────────────────────────────────────────── */
.category-badge {
  background: var(--mk-gold-bg) !important;
  color: var(--mk-gold) !important;
  border-color: rgba(176,125,44,0.3) !important;
}
.verified-badge {
  background: rgba(5,150,105,0.08) !important;
  color: var(--mk-green) !important;
  border-color: rgba(5,150,105,0.2) !important;
}

/* ── Social / misc buttons ────────────────────────────────── */
.social-btn {
  background: var(--mk-white) !important;
  border-color: var(--mk-border) !important;
  color: var(--mk-text-2) !important;
}
.social-btn:hover {
  background: var(--mk-bg) !important;
  border-color: var(--mk-border-2) !important;
}

/* ── Upload zones ─────────────────────────────────────────── */
.upload-zone {
  border-color: var(--mk-border) !important;
  background: var(--mk-bg) !important;
}
.upload-zone:hover {
  border-color: var(--mk-gold) !important;
  background: var(--mk-gold-bg) !important;
}

/* ── Visibility rows ──────────────────────────────────────── */
.visibility-row {
  background: var(--mk-bg) !important;
  border-color: var(--mk-border) !important;
}
.visibility-row:hover { background: #EEF2FF !important; }

/* ── Score bars ───────────────────────────────────────────── */
.score-bar-bg { background: var(--mk-border) !important; }

/* ── Tab buttons ──────────────────────────────────────────── */
.tab-btn { color: var(--mk-text-3) !important; border-color: transparent !important; }
.tab-btn.active { color: var(--mk-gold) !important; border-color: var(--mk-gold) !important; }

/* ── FAQ items ────────────────────────────────────────────── */
.faq-item { border-color: var(--mk-border) !important; }
.comparison-row:hover { background: var(--mk-bg) !important; }
.toggle-btn.active { background: var(--mk-gold-bg) !important; color: var(--mk-gold) !important; }

/* ── Alerts / info boxes ──────────────────────────────────── */
[style*="background: rgba(0,0,0,0.2)"] { background: var(--mk-bg) !important; }
[style*="rgba(255,255,255,0.03)"] { background: var(--mk-bg) !important; }
[style*="rgba(255,255,255,0.04)"] { background: var(--mk-bg) !important; }
[style*="rgba(255,255,255,0.05)"] { background: var(--mk-bg) !important; }
[style*="rgba(255,255,255,0.08)"] { background: var(--mk-border) !important; }

/* ── Gold tinted sections ─────────────────────────────────── */
[style*="rgba(212,168,83,0.1)"] { background: var(--mk-gold-bg) !important; }
[style*="rgba(212,168,83,0.08)"] { background: var(--mk-gold-bg) !important; }
[style*="rgba(212,168,83,0.15)"] { background: var(--mk-gold-bg) !important; }

/* ── Error/success states ─────────────────────────────────── */
[class*="bg-red-500/10"]   { background: #FEF2F2 !important; }
[class*="bg-green-500/10"] { background: #F0FDF4 !important; }
[class*="bg-blue-500/10"]  { background: #EFF6FF !important; }

/* ── Background decorations (soften) ─────────────────────── */
[class*="opacity-8"], [class*="opacity-5"] { opacity: 0.03 !important; }
.fixed.inset-0.pointer-events-none { opacity: 0.06 !important; }

/* ── Msg rows ─────────────────────────────────────────────── */
.msg-row:hover { background: var(--mk-bg) !important; }

/* ── User avatar in sidebar ───────────────────────────────── */
[style*="rgba(212,168,83,0.2)"] { background: var(--mk-gold-bg) !important; }

/* ── Check/cross items in pricing ────────────────────────── */
.check-item { color: var(--mk-text-2) !important; }
.cross-item { color: var(--mk-text-4) !important; }