/* ============================================================
   EmailFree.in – Frontend Styles v2.0
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body.elp-body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: #1a1a2e;
  background: #fff;
  line-height: 1.6;
}

/* ── HEADER ──────────────────────────────────────────────────── */
.elp-header {
  background: #fff;
  border-bottom: 1px solid #e8eaf6;
  position: sticky; top: 0; z-index: 999;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
.elp-header-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: .85rem 1.5rem;
}
.elp-logo {
  font-size: 1.4rem; font-weight: 800; color: #1a1a2e;
  text-decoration: none; display: flex; align-items: center; gap: .4rem;
}
.elp-logo span { color: #2563eb; }
.elp-logo-icon { font-size: 1.3rem; }

.elp-nav { display: flex; align-items: center; gap: 1.2rem; }
.elp-nav a {
  color: #374151; text-decoration: none; font-size: .95rem; font-weight: 500;
  transition: color .2s;
}
.elp-nav a:hover { color: #2563eb; }
.elp-nav-btn, a.elp-nav-btn {
  background: #2563eb; color: #fff !important;
  padding: .45rem 1.1rem; border-radius: 8px; font-weight: 600;
  transition: background .2s;
}
.elp-nav-btn:hover { background: #1d4ed8 !important; }
.elp-hamburger {
  display: none; background: none; border: none;
  font-size: 1.4rem; cursor: pointer; color: #374151;
}

/* ── MAIN ────────────────────────────────────────────────────── */
.elp-main { min-height: calc(100vh - 120px); }

/* ── HERO ────────────────────────────────────────────────────── */
.elp-hero {
  background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 60%, #3b82f6 100%);
  color: #fff; text-align: center;
  padding: 5rem 1.5rem 4rem;
}
.elp-badge {
  display: inline-block; background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.3); border-radius: 50px;
  padding: .3rem 1rem; font-size: .8rem; font-weight: 600;
  letter-spacing: .5px; margin-bottom: 1.2rem;
}
.elp-hero h1 {
  font-size: clamp(2rem, 5vw, 3.2rem); font-weight: 900;
  line-height: 1.15; margin-bottom: 1rem;
}
.elp-hero h1 span { color: #fbbf24; }
.elp-hero p { font-size: 1.1rem; opacity: .9; max-width: 600px; margin: 0 auto 2rem; }
.elp-hero-btns { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.elp-hero-note { font-size: .85rem; opacity: .75; margin-top: 1rem; }

/* ── BUTTONS ─────────────────────────────────────────────────── */
.elp-btn-primary {
  display: inline-block; background: #2563eb; color: #fff !important;
  padding: .75rem 1.8rem; border-radius: 10px; font-weight: 700;
  text-decoration: none; border: none; cursor: pointer; font-size: .95rem;
  transition: background .2s, transform .15s;
}
.elp-btn-primary:hover { background: #1d4ed8; transform: translateY(-1px); color: #fff !important; }
.elp-btn-secondary {
  display: inline-block; background: rgba(255,255,255,.15);
  border: 2px solid #fff; color: #fff !important;
  padding: .75rem 1.8rem; border-radius: 10px; font-weight: 700;
  text-decoration: none; cursor: pointer; font-size: .95rem;
  transition: background .2s;
}
.elp-btn-secondary:hover { background: rgba(255,255,255,.25); color: #fff !important; }
.elp-btn-outline {
  display: inline-block; background: transparent;
  border: 2px solid #2563eb; color: #2563eb !important;
  padding: .75rem 1.8rem; border-radius: 10px; font-weight: 700;
  text-decoration: none; cursor: pointer; font-size: .95rem;
  transition: all .2s;
}
.elp-btn-outline:hover { background: #2563eb; color: #fff !important; }
.elp-btn-lg { font-size: 1.05rem; padding: .9rem 2.2rem; }
.elp-btn-full { width: 100%; text-align: center; }

/* ── STATS ───────────────────────────────────────────────────── */
.elp-stats-section { background: #f8faff; padding: 2.5rem 1.5rem; }
.elp-stats-grid {
  max-width: 900px; margin: 0 auto;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: 1rem;
}
.elp-stat-card {
  background: #fff; border-radius: 12px; padding: 1.5rem;
  text-align: center; box-shadow: 0 2px 8px rgba(0,0,0,.06);
  border: 1px solid #e8eaf6;
}
.elp-stat-num { display: block; font-size: 2rem; font-weight: 900; color: #2563eb; }

/* ── SECTIONS ────────────────────────────────────────────────── */
.elp-section { max-width: 1100px; margin: 0 auto; padding: 4rem 1.5rem; }
.elp-bg-light { background: #f8faff; max-width: 100%; padding: 4rem 1.5rem; }
.elp-bg-light > * { max-width: 1100px; margin-left: auto; margin-right: auto; }
.elp-section h2 { font-size: 2rem; font-weight: 800; text-align: center; margin-bottom: .5rem; }
.elp-section-sub { text-align: center; color: #6b7280; margin-bottom: 2.5rem; }

/* ── STEPS ───────────────────────────────────────────────────── */
.elp-steps {
  display: flex; align-items: flex-start; gap: 1rem;
  flex-wrap: wrap; justify-content: center; margin-bottom: 2rem;
}
.elp-step {
  flex: 1; min-width: 200px; max-width: 280px;
  background: #fff; border: 1px solid #e8eaf6;
  border-radius: 12px; padding: 1.5rem; text-align: center;
}
.elp-step-num {
  width: 3rem; height: 3rem; border-radius: 50%;
  background: #2563eb; color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; font-weight: 800; margin: 0 auto 1rem;
}
.elp-step h3 { font-size: 1rem; margin-bottom: .5rem; }
.elp-step p { font-size: .9rem; color: #6b7280; }
.elp-step-arrow { font-size: 1.5rem; color: #2563eb; margin-top: 2rem; }

/* ── FEATURES ────────────────────────────────────────────────── */
.elp-features-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px,1fr));
  gap: 1.5rem; max-width: 1100px; margin: 0 auto;
}
.elp-feature { background: #fff; border-radius: 12px; padding: 1.5rem; border: 1px solid #e8eaf6; }
.elp-feature-icon { font-size: 1.8rem; margin-bottom: .75rem; }
.elp-feature h4 { font-size: 1rem; margin-bottom: .5rem; }
.elp-feature p { font-size: .9rem; color: #6b7280; }

/* ── PRICING ─────────────────────────────────────────────────── */
.elp-pricing-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px,1fr));
  gap: 1.5rem; max-width: 700px; margin: 0 auto 2rem;
}
.elp-price-card {
  background: #fff; border: 2px solid #e8eaf6; border-radius: 16px;
  padding: 2rem; position: relative;
}
.elp-price-featured { border-color: #2563eb; }
.elp-price-amt { font-size: 2.5rem; font-weight: 900; color: #1a1a2e; margin: .5rem 0; }
.elp-price-amt span { font-size: 1rem; color: #6b7280; font-weight: 400; }
.elp-price-leads { color: #2563eb; font-weight: 700; font-size: 1.1rem; margin-bottom: 1.2rem; }
.elp-price-features { list-style: none; padding: 0; margin-bottom: 1.5rem; }
.elp-price-features li { padding: .3rem 0; font-size: .9rem; }

.elp-popular-badge {
  background: #2563eb; color: #fff;
  font-size: .75rem; font-weight: 700; letter-spacing: .5px;
  padding: .25rem .8rem; border-radius: 50px;
  position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
  white-space: nowrap;
}

/* Packages grid */
.elp-packages-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(170px,1fr));
  gap: 1rem; max-width: 1000px; margin: 0 auto 2rem;
}
.elp-pkg-card {
  background: #fff; border: 2px solid #e8eaf6; border-radius: 14px;
  padding: 1.5rem; text-align: center; position: relative;
  transition: border-color .2s;
}
.elp-pkg-popular { border-color: #2563eb; }
.elp-pkg-price { font-size: 1.8rem; font-weight: 900; color: #1a1a2e; margin: .5rem 0; }
.elp-pkg-per { font-size: .8rem; color: #6b7280; margin-bottom: 1rem; }

/* Mini pricing */
.elp-pricing-mini {
  display: flex; gap: 1.5rem; justify-content: center; flex-wrap: wrap;
}
.elp-price-mini-card {
  background: #fff; border: 2px solid #e8eaf6; border-radius: 14px;
  padding: 1.5rem 2rem; text-align: center; min-width: 220px; position: relative;
}
.elp-price-mini-popular { border-color: #2563eb; }
.elp-price-mini-amt { font-size: 2rem; font-weight: 900; }
.elp-price-mini-amt span { font-size: .9rem; color: #6b7280; font-weight: 400; }
.elp-price-mini-leads { color: #2563eb; font-weight: 700; margin-bottom: 1rem; }

/* ── FAQ ─────────────────────────────────────────────────────── */
.elp-faq { max-width: 800px; margin: 4rem auto 0; }
.elp-faq h2 { font-size: 1.8rem; margin-bottom: 1.5rem; }
.elp-faq-item { border-bottom: 1px solid #e8eaf6; padding: 1.2rem 0; }
.elp-faq-item h4 { font-size: 1rem; margin-bottom: .5rem; }
.elp-faq-item p { font-size: .9rem; color: #6b7280; }

/* ── AUTH ────────────────────────────────────────────────────── */
.elp-auth-section { max-width: 520px; margin: 3rem auto; padding: 0 1rem; }
.elp-auth-card {
  background: #fff; border: 1px solid #e8eaf6; border-radius: 16px;
  padding: 2.5rem; box-shadow: 0 4px 20px rgba(0,0,0,.07);
}
.elp-auth-badge {
  display: inline-block; background: #dcfce7; color: #15803d;
  border-radius: 50px; padding: .3rem .9rem; font-size: .8rem; font-weight: 600;
  margin-bottom: 1rem;
}
.elp-auth-card h2 { font-size: 1.6rem; margin-bottom: .4rem; }
.elp-auth-card > p { color: #6b7280; margin-bottom: 1.5rem; }

.elp-form-group { margin-bottom: 1.1rem; }
.elp-form-group label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: .35rem; color: #374151; }
.elp-form-group input {
  width: 100%; padding: .75rem 1rem;
  border: 1.5px solid #d1d5db; border-radius: 9px;
  font-size: .95rem; transition: border-color .2s; color: #1a1a2e;
}
.elp-form-group input:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.1); }

.elp-auth-checks {
  display: flex; flex-wrap: wrap; gap: .5rem 1.2rem;
  margin: 1rem 0; font-size: .82rem; color: #16a34a;
}
.elp-auth-switch { text-align: center; margin-top: 1rem; font-size: .9rem; color: #6b7280; }
.elp-auth-switch a { color: #2563eb; font-weight: 600; }

/* ── FORM MSG ────────────────────────────────────────────────── */
.elp-form-msg {
  padding: .75rem 1rem; border-radius: 8px; font-size: .9rem;
  margin-bottom: 1rem;
}
.elp-form-msg.success { background: #dcfce7; color: #15803d; border: 1px solid #bbf7d0; }
.elp-form-msg.error   { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }

/* ── NOTICE ──────────────────────────────────────────────────── */
.elp-notice {
  background: #dbeafe; color: #1e40af; border: 1px solid #bfdbfe;
  padding: .75rem 1.2rem; border-radius: 8px; margin: 1rem 0;
}
.elp-notice a { color: #1d4ed8; font-weight: 600; }

/* ── DASHBOARD ───────────────────────────────────────────────── */
.elp-dashboard { max-width: 900px; margin: 2.5rem auto; padding: 0 1.5rem; }
.elp-dash-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  flex-wrap: wrap; gap: 1rem; margin-bottom: 2rem;
}
.elp-dash-header h2 { font-size: 1.8rem; margin-bottom: .2rem; }
.elp-dash-email { color: #6b7280; font-size: .9rem; }

.elp-dash-stats {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr));
  gap: 1rem; margin-bottom: 1.5rem;
}
.elp-dash-stat {
  background: #fff; border: 1px solid #e8eaf6; border-radius: 12px;
  padding: 1.2rem 1.5rem;
}
.elp-dash-stat label { font-size: .82rem; color: #6b7280; display: block; margin-bottom: .3rem; }
.elp-dash-stat strong { font-size: 1.8rem; font-weight: 800; color: #1a1a2e; }

.elp-quota-bar {
  height: 8px; background: #e8eaf6; border-radius: 4px;
  overflow: hidden; margin-bottom: .4rem;
}
.elp-quota-fill { height: 100%; background: #2563eb; border-radius: 4px; transition: width .4s; }
.elp-quota-label { font-size: .82rem; color: #6b7280; text-align: right; margin-bottom: 1.5rem; }

.elp-dash-notice {
  background: #f0f9ff; border: 1px solid #bae6fd; border-radius: 12px;
  padding: 1.5rem; margin-bottom: 1.5rem;
}
.elp-dash-notice strong { display: block; margin-bottom: .3rem; }
.elp-dash-notice p { color: #6b7280; margin-bottom: 1rem; font-size: .9rem; }
.elp-dash-warning { background: #fefce8; border-color: #fef08a; }

.elp-dash-actions { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 2rem; }

/* ── LEADS DOWNLOAD ──────────────────────────────────────────── */
.elp-leads-section { max-width: 900px; margin: 2.5rem auto; padding: 0 1.5rem; }
.elp-leads-info {
  background: #f0f9ff; border: 1px solid #bae6fd;
  padding: .75rem 1.2rem; border-radius: 8px; margin-bottom: 1.5rem;
}
.elp-leads-card {
  background: #fff; border: 1px solid #e8eaf6; border-radius: 16px;
  padding: 2rem; box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.elp-leads-card h3 { font-size: 1.4rem; margin-bottom: .5rem; }
.elp-leads-card > p { color: #6b7280; margin-bottom: 1.5rem; }
.elp-leads-filters {
  display: flex; gap: .75rem; flex-wrap: wrap; margin-bottom: 1.5rem;
}
.elp-leads-filters select {
  flex: 1; min-width: 140px; padding: .65rem 1rem;
  border: 1.5px solid #d1d5db; border-radius: 8px; font-size: .9rem;
  background: #fff; cursor: pointer;
}

/* ── BUY PACKAGES ────────────────────────────────────────────── */
.elp-buy-packages {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr));
  gap: 1rem; max-width: 1000px; margin: 0 auto 2rem;
}
.elp-buy-pkg {
  background: #fff; border: 2px solid #e8eaf6; border-radius: 14px;
  padding: 1.5rem; text-align: center; position: relative; cursor: pointer;
  transition: border-color .2s, box-shadow .2s;
}
.elp-buy-pkg:hover, .elp-buy-pkg-selected { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.elp-buy-pkg-popular { border-color: #2563eb; }

/* ── CTA SECTION ─────────────────────────────────────────────── */
.elp-cta-section {
  background: linear-gradient(135deg, #1e3a8a, #2563eb);
  color: #fff; text-align: center; padding: 4rem 1.5rem;
}
.elp-cta-section h2 { font-size: 2rem; margin-bottom: .75rem; }
.elp-cta-section p { opacity: .85; margin-bottom: 2rem; }
.elp-cta-note { margin-top: 1rem; font-size: .85rem; opacity: .7; }

/* ── SEO CONTENT ─────────────────────────────────────────────── */
.elp-seo-content { max-width: 800px; padding: 3rem 1.5rem; }
.elp-seo-content h2, .elp-seo-content h3 { margin: 1.5rem 0 .75rem; }
.elp-seo-content p { color: #4b5563; line-height: 1.7; margin-bottom: 1rem; }

/* ── FOOTER ──────────────────────────────────────────────────── */
.elp-footer { background: #1a1a2e; color: #d1d5db; padding: 3rem 1.5rem 0; }
.elp-footer-inner {
  max-width: 1100px; margin: 0 auto;
  display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 2rem;
  padding-bottom: 2.5rem;
}
.elp-footer-brand p { font-size: .9rem; margin-top: .5rem; opacity: .7; }
.elp-footer-links h4 { color: #fff; font-size: .9rem; margin-bottom .75rem; letter-spacing: .5px; }
.elp-footer-links a {
  display: block; color: #9ca3af; text-decoration: none;
  font-size: .88rem; margin-bottom: .4rem; transition: color .2s;
}
.elp-footer-links a:hover { color: #fff; }
.elp-footer-bottom {
  border-top: 1px solid #374151; padding: 1.2rem 0;
  max-width: 1100px; margin: 0 auto;
  font-size: .82rem; color: #6b7280; text-align: center;
}

/* ── RESPONSIVE ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .elp-nav > a, .elp-nav-btn { display: none; }
  .elp-hamburger { display: block; }
  .elp-nav.open > a, .elp-nav.open > .elp-nav-btn { display: block; }
  .elp-nav.open {
    position: absolute; top: 65px; left: 0; right: 0;
    background: #fff; padding: 1rem 1.5rem;
    flex-direction: column; border-bottom: 1px solid #e8eaf6;
    box-shadow: 0 4px 12px rgba(0,0,0,.1);
  }
  .elp-header { position: relative; }
  .elp-footer-inner { grid-template-columns: 1fr; }
  .elp-steps { flex-direction: column; align-items: center; }
  .elp-step-arrow { transform: rotate(90deg); margin: 0; }
  .elp-dash-actions { flex-direction: column; }
}

/* ── SPINNER ─────────────────────────────────────────────────── */
.elp-spinner {
  display: inline-block; width: 18px; height: 18px;
  border: 2px solid rgba(255,255,255,.3); border-top-color: #fff;
  border-radius: 50%; animation: elp-spin .6s linear infinite;
  margin-right: .5rem; vertical-align: middle;
}
@keyframes elp-spin { to { transform: rotate(360deg); } }

/* ── LEGAL PAGES ─────────────────────────────────────────────── */
.elp-legal-page { max-width: 860px; margin: 0 auto; padding: 0 1.5rem 3rem; }

.elp-legal-hero {
  background: linear-gradient(135deg,#1e3a8a,#2563eb);
  color:#fff; text-align:center;
  padding: 3rem 2rem; border-radius: 0 0 16px 16px; margin-bottom: 2.5rem;
}
.elp-legal-icon { font-size:3rem; margin-bottom:.75rem; }
.elp-legal-hero h1 { font-size:2rem; font-weight:800; margin-bottom:.5rem; }
.elp-legal-hero p { opacity:.85; max-width:500px; margin:0 auto .75rem; }
.elp-legal-date {
  display:inline-block; background:rgba(255,255,255,.15);
  border-radius:50px; padding:.25rem .9rem; font-size:.8rem;
}

.elp-legal-body h2 {
  font-size:1.25rem; font-weight:700; margin:2rem 0 .75rem;
  padding-bottom:.4rem; border-bottom:2px solid #e8eaf6; color:#1a1a2e;
}
.elp-legal-body h3 { font-size:1.05rem; font-weight:700; margin:1.5rem 0 .5rem; }
.elp-legal-body p  { color:#4b5563; line-height:1.8; margin-bottom:1rem; }
.elp-legal-body ul { padding-left:1.5rem; margin-bottom:1rem; }
.elp-legal-body ul li { color:#4b5563; line-height:1.8; margin-bottom:.3rem; }
.elp-legal-body a  { color:#2563eb; }

.elp-legal-footer-links {
  display:flex; flex-wrap:wrap; gap:.75rem; justify-content:center;
  padding:1.5rem 0; border-top:1px solid #e8eaf6; margin-top:2rem;
}
.elp-legal-footer-links a {
  color:#6b7280; font-size:.85rem; text-decoration:none;
  padding:.35rem .85rem; border:1px solid #e8eaf6; border-radius:50px;
  transition:all .2s;
}
.elp-legal-footer-links a:hover { background:#2563eb; color:#fff; border-color:#2563eb; }

/* ── CONTACT PAGE ─────────────────────────────────────────────── */
.elp-contact-grid {
  display:grid; grid-template-columns:1fr 1.2fr; gap:2.5rem; margin-top:1rem;
}
.elp-contact-info h2 { font-size:1.4rem; margin-bottom:1rem; }
.elp-contact-info > p { color:#6b7280; margin-bottom:1.5rem; }
.elp-contact-card {
  display:flex; align-items:flex-start; gap:1rem;
  background:#f8faff; border:1px solid #e8eaf6; border-radius:10px;
  padding:1rem; margin-bottom:.75rem;
}
.elp-contact-icon { font-size:1.4rem; flex-shrink:0; }
.elp-contact-card strong { display:block; font-size:.85rem; color:#6b7280; margin-bottom:.2rem; }
.elp-contact-card a, .elp-contact-card span { color:#1a1a2e; font-weight:600; font-size:.95rem; }
.elp-contact-faq-list { list-style:none; padding:0; }
.elp-contact-faq-list li { padding:.3rem 0; color:#374151; font-size:.9rem; }

.elp-contact-form-wrap h2 { font-size:1.4rem; margin-bottom:1.2rem; }
.elp-contact-form-wrap textarea {
  width:100%; padding:.75rem 1rem;
  border:1.5px solid #d1d5db; border-radius:9px;
  font-size:.95rem; font-family:inherit; resize:vertical;
  transition:border-color .2s;
}
.elp-contact-form-wrap textarea:focus {
  outline:none; border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.1);
}
.elp-contact-form-wrap select {
  width:100%; padding:.75rem 1rem;
  border:1.5px solid #d1d5db; border-radius:9px;
  font-size:.95rem; background:#fff; cursor:pointer;
}

@media(max-width:768px) {
  .elp-contact-grid { grid-template-columns:1fr; }
}

/* ── FOOTER 4-column ─────────────────────────────────────────── */
.elp-footer-inner { grid-template-columns: 1.5fr 1fr 1fr 1fr; }
@media(max-width:768px) { .elp-footer-inner { grid-template-columns:1fr; } }

/* ═══════════════════════════════════════════════════════
   v2.4 ADDITIONS & FIXES
═══════════════════════════════════════════════════════ */

/* ── Hamburger button (3-bar icon) ───────────────────── */
.elp-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 38px;
  height: 38px;
  background: none;
  border: 1.5px solid #e8eaf6;
  border-radius: 8px;
  cursor: pointer;
  padding: 6px;
}
.elp-ham-bar {
  display: block;
  height: 2px;
  background: #374151;
  border-radius: 2px;
  transition: transform .25s, opacity .25s;
}
/* X state when open */
.elp-hamburger.active .elp-ham-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.elp-hamburger.active .elp-ham-bar:nth-child(2) { opacity: 0; }
.elp-hamburger.active .elp-ham-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── Nav outline button (logout link) ────────────────── */
a.elp-nav-btn-outline, .elp-nav-btn-outline {
  border: 1.5px solid #d1d5db !important;
  border-radius: 8px;
  padding: .38rem .9rem !important;
  color: #374151 !important;
  font-weight: 600;
  transition: border-color .2s, background .2s;
}
a.elp-nav-btn-outline:hover, .elp-nav-btn-outline:hover {
  border-color: #ef4444 !important;
  color: #ef4444 !important;
}

/* ── Small button ────────────────────────────────────── */
.elp-btn-sm {
  padding: .45rem 1rem !important;
  font-size: .88rem !important;
}

/* ── Email verification banner ───────────────────────── */
.elp-verify-banner {
  background: #fffbeb;
  border: 1.5px solid #f59e0b;
  border-radius: 12px;
  padding: 1.2rem 1.5rem;
  margin-bottom: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
}
.elp-verify-banner > div { flex: 1; min-width: 200px; }
.elp-verify-banner strong { display: block; color: #92400e; margin-bottom: .25rem; }
.elp-verify-banner p { color: #78350f; font-size: .9rem; margin: 0; }

/* ── Mobile nav – complete responsive fix ────────────── */
@media (max-width: 768px) {
  /* Show hamburger, hide nav links by default */
  .elp-hamburger { display: flex; }
  .elp-nav a,
  .elp-nav .elp-nav-btn,
  .elp-nav .elp-nav-btn-outline { display: none; }

  /* Dropdown when .open is added via JS */
  .elp-nav.open {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid #e8eaf6;
    border-bottom: 1px solid #e8eaf6;
    box-shadow: 0 8px 20px rgba(0,0,0,.10);
    padding: .75rem 1.5rem 1.25rem;
    z-index: 998;
    gap: .1rem;
  }
  .elp-nav.open a,
  .elp-nav.open .elp-nav-btn,
  .elp-nav.open .elp-nav-btn-outline {
    display: block;
    padding: .7rem 0;
    border-bottom: 1px solid #f3f4f6;
    font-size: 1rem;
  }
  .elp-nav.open a:last-child { border-bottom: none; }
  .elp-nav.open .elp-nav-btn {
    background: #2563eb;
    color: #fff !important;
    text-align: center;
    border-radius: 8px;
    padding: .75rem 1rem;
    margin-top: .5rem;
    border-bottom: none;
  }
  .elp-header { position: relative; }
}

/* ============================================================
   v2.5 – Tabbed Dashboard, Forgot Password, Profile
   ============================================================ */

/* ── Tabs ──────────────────────────────────────────────────── */
.elp-tabs {
  display: flex; gap: 0; border-bottom: 2px solid #e5e7eb;
  margin-bottom: 2rem; overflow-x: auto;
}
.elp-tab {
  padding: .75rem 1.25rem; font-size: .95rem; font-weight: 600;
  color: #6b7280; text-decoration: none; border-bottom: 3px solid transparent;
  white-space: nowrap; transition: all .2s;
}
.elp-tab:hover { color: #2563eb; }
.elp-tab.active { color: #2563eb; border-bottom-color: #2563eb; }

/* ── Verified / Unverified badges ──────────────────────────── */
.elp-badge-verified {
  display: inline-block; font-size: .78rem; font-weight: 600;
  color: #059669; background: #ecfdf5; padding: .15rem .6rem;
  border-radius: 99px; margin-left: .5rem;
}
.elp-badge-unverified {
  display: inline-block; font-size: .78rem; font-weight: 600;
  color: #d97706; background: #fffbeb; padding: .15rem .6rem;
  border-radius: 99px; margin-left: .5rem;
}

/* ── Tables ────────────────────────────────────────────────── */
.elp-table-wrap { overflow-x: auto; }
.elp-table {
  width: 100%; border-collapse: collapse; font-size: .9rem;
}
.elp-table th {
  background: #f9fafb; color: #374151; font-weight: 700; text-align: left;
  padding: .75rem 1rem; border-bottom: 2px solid #e5e7eb; white-space: nowrap;
}
.elp-table td {
  padding: .65rem 1rem; border-bottom: 1px solid #f3f4f6; color: #374151;
}
.elp-table tr:hover td { background: #f9fafb; }
.elp-table code {
  font-size: .8rem; background: #f3f4f6; padding: .15rem .4rem;
  border-radius: 4px; word-break: break-all;
}
.elp-table-note { text-align: center; color: #9ca3af; font-size: .82rem; margin-top: .75rem; }

/* ── Status badges ─────────────────────────────────────────── */
.elp-status-badge {
  display: inline-block; font-size: .78rem; font-weight: 600;
  padding: .2rem .65rem; border-radius: 99px; white-space: nowrap;
}
.elp-status-success { color: #059669; background: #ecfdf5; }
.elp-status-pending { color: #d97706; background: #fffbeb; }
.elp-status-failed  { color: #dc2626; background: #fef2f2; }

/* ── Empty state ───────────────────────────────────────────── */
.elp-empty-state {
  text-align: center; padding: 3rem 1rem; color: #6b7280;
  background: #f9fafb; border-radius: 12px; margin: 1rem 0;
}
.elp-empty-state p { font-size: 1.1rem; margin-bottom: 1rem; }

/* ── History section ───────────────────────────────────────── */
.elp-history-section h3 { font-size: 1.2rem; margin-bottom: 1rem; }

/* ── Profile ───────────────────────────────────────────────── */
.elp-profile-section h3 { font-size: 1.15rem; margin-bottom: 1rem; }
.elp-profile-card {
  background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 12px;
  padding: 1.5rem; margin-bottom: 1rem;
}
.elp-profile-card .elp-form-group { margin-bottom: 1rem; }
.elp-profile-card .elp-form-group:last-of-type { margin-bottom: 1.25rem; }
.elp-profile-card small { display: block; color: #9ca3af; font-size: .8rem; margin-top: .25rem; }
.elp-profile-card input[disabled] { background: #e5e7eb; color: #9ca3af; cursor: not-allowed; }
.elp-account-info { display: flex; flex-direction: column; gap: .75rem; }
.elp-info-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: .5rem 0; border-bottom: 1px solid #e5e7eb;
}
.elp-info-row:last-child { border-bottom: none; }
.elp-info-row span { color: #6b7280; }

/* ── Forgot password link ──────────────────────────────────── */
.elp-auth-forgot {
  text-align: right; margin: -.25rem 0 .75rem; font-size: .88rem;
}
.elp-auth-forgot a { color: #2563eb; text-decoration: none; }
.elp-auth-forgot a:hover { text-decoration: underline; }

/* ── User dashboard wrapper ────────────────────────────────── */
.elp-user-dashboard { max-width: 900px; margin: 0 auto; padding: 2rem 1rem; }

/* ── Mobile responsive for tabs & tables ───────────────────── */
@media (max-width: 640px) {
  .elp-tabs { gap: 0; }
  .elp-tab { padding: .6rem .75rem; font-size: .85rem; }
  .elp-table th, .elp-table td { padding: .5rem .6rem; font-size: .82rem; }
  .elp-info-row { flex-direction: column; align-items: flex-start; gap: .2rem; }
  .elp-profile-card { padding: 1rem; }
}
