/* ── NexMark Onboarding Form ─────────────────────── */
:root {
  --nxm-primary:    #0b3569;
  --nxm-accent:     #fcb614;
  --nxm-dark:       #0b1f3a;
  --nxm-muted:      #6B7280;
  --nxm-border:     #eaeaea;
  --nxm-bg:         #f5f7fa;
  --nxm-white:      #FFFFFF;
  --nxm-success:    #059669;
  --nxm-radius:     12px;
  --nxm-shadow:     0 4px 24px rgba(11,53,105,.12);
}

.nxm-wrap { font-family: 'Inter', 'Segoe UI', Arial, sans-serif; max-width: 780px; margin: 0 auto; padding: 0 16px 48px; color: var(--nxm-dark); }

/* HERO */
.nxm-hero { background: linear-gradient(135deg, var(--nxm-primary) 0%, #0d4080 100%); border-radius: 16px; padding: 36px 32px 28px; margin-bottom: 32px; color: #fff; position: relative; overflow: hidden; }
.nxm-hero::before { content:''; position:absolute; right:-40px; top:-40px; width:200px; height:200px; background:rgba(252,182,20,.10); border-radius:50%; }
.nxm-hero::after { content:''; position:absolute; left:-30px; bottom:-50px; width:160px; height:160px; background:rgba(252,182,20,.06); border-radius:50%; }
.nxm-hero-badge { display:inline-block; background:rgba(252,182,20,.20); border:1px solid rgba(252,182,20,.45); color:#fcb614; padding:4px 14px; border-radius:100px; font-size:12px; font-weight:600; letter-spacing:.5px; margin-bottom:12px; }
.nxm-hero-title { font-size:28px; font-weight:800; margin:0 0 6px; color:#ffffff !important; }
.nxm-hero-badge { color:#fcb614 !important; }
#nxm-client-info-form .nxm-hero-title { color:#ffffff !important; }
.nxm-hero-sub { font-size:14px; color:rgba(255,255,255,.8); margin:0 0 20px; }
.nxm-req { color:#fcb614; }
.nxm-progress-wrap { background:rgba(255,255,255,.20); border-radius:100px; height:6px; margin-bottom:6px; }
.nxm-progress-bar { background:#fcb614; height:6px; border-radius:100px; transition: width .4s ease; width:14.28%; }
.nxm-progress-label { font-size:12px; color:rgba(255,255,255,.70); margin:0; }

/* STEPS */
.nxm-step { display:none; }
.nxm-step.active { display:block; animation: nxmFadeIn .3s ease; }
@keyframes nxmFadeIn { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }

/* SECTION HEAD */
.nxm-section-head { display:flex; align-items:flex-start; gap:14px; background:#fff; border:1px solid var(--nxm-border); border-left:4px solid var(--nxm-accent); border-radius:10px; padding:16px 20px; margin-bottom:24px; }
.nxm-section-icon { font-size:28px; line-height:1; }
.nxm-section-title { font-size:18px; font-weight:700; margin:0 0 2px; color:var(--nxm-primary); }
.nxm-section-desc  { font-size:13px; color:var(--nxm-muted); margin:0; }

/* GRID */
.nxm-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media(max-width:580px) { .nxm-grid-2 { grid-template-columns:1fr; } }

/* FIELDS */
.nxm-field { margin-bottom:20px; }
.nxm-label { display:block; font-size:13px; font-weight:600; margin-bottom:6px; color:var(--nxm-dark); }
.nxm-input, .nxm-textarea {
  width:100%; box-sizing:border-box;
  border:1.5px solid var(--nxm-border);
  border-radius:8px; padding:10px 14px;
  font-size:14px; font-family:inherit;
  color:var(--nxm-dark); background:#fff;
  transition:border-color .2s, box-shadow .2s;
}
.nxm-input:focus, .nxm-textarea:focus {
  outline:none;
  border-color:var(--nxm-primary);
  box-shadow:0 0 0 3px rgba(11,53,105,.12);
}
.nxm-textarea { resize:vertical; min-height:80px; }
.nxm-hint { display:block; font-size:11.5px; color:var(--nxm-muted); margin-top:4px; }

/* SOCIAL LABELS */
.nxm-social-label { display:flex; align-items:center; gap:7px; }
.nxm-social-dot { width:10px; height:10px; border-radius:50%; display:inline-block; }
.nxm-social-dot.fb { background:#1877F2; }
.nxm-social-dot.ig { background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF); }
.nxm-social-dot.li { background:#0A66C2; }
.nxm-social-dot.yt { background:#FF0000; }

/* CARD SELECT — website type */
.nxm-card-select { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:6px; }
.nxm-card-opt {
  border:2px solid var(--nxm-border); border-radius:10px;
  padding:10px 14px; cursor:pointer; display:flex;
  align-items:center; gap:8px; font-size:13px; font-weight:500;
  transition:all .2s; background:#fff; user-select:none;
}
.nxm-card-opt:hover { border-color:var(--nxm-accent); background:var(--nxm-bg); }
.nxm-card-opt.selected { border-color:var(--nxm-primary); background:#eaf0fa; color:var(--nxm-primary); font-weight:700; }
.nxm-card-icon { font-size:18px; }

/* STYLE GRID */
.nxm-style-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:8px; }
@media(max-width:620px) { .nxm-style-grid { grid-template-columns:repeat(2,1fr); } }
.nxm-style-opt {
  border:2px solid var(--nxm-border); border-radius:10px;
  padding:10px 8px; text-align:center; cursor:pointer;
  font-size:12px; font-weight:500; transition:all .2s;
  background:#fff; user-select:none;
}
.nxm-style-opt:hover { border-color:var(--nxm-accent); }
.nxm-style-opt.selected { border-color:var(--nxm-primary); background:#eaf0fa; color:var(--nxm-primary); font-weight:700; }
.nxm-style-preview { height:36px; border-radius:6px; margin-bottom:8px; }
.nxm-style-preview.modern    { background:linear-gradient(135deg,#0b3569,#1a5ca8); }
.nxm-style-preview.minimal   { background:#F9FAFB; border:1.5px solid #eaeaea; }
.nxm-style-preview.corporate { background:linear-gradient(135deg,#0b3569,#fcb614); }
.nxm-style-preview.bold      { background:linear-gradient(135deg,#fcb614,#e09a00); }
.nxm-style-preview.elegant   { background:linear-gradient(135deg,#0b1f3a,#fcb614); }

/* DIVIDER */
.nxm-divider { border:none; border-top:1px solid var(--nxm-border); margin:24px 0; }

/* SIGN OFF */
.nxm-signoff-box { background:var(--nxm-bg); border:1.5px solid var(--nxm-border); border-radius:12px; padding:24px; }
.nxm-signoff-title { font-size:16px; font-weight:700; margin:0 0 4px; }
.nxm-signoff-desc { font-size:13px; color:var(--nxm-muted); margin:0 0 18px; }
.nxm-checkbox-wrap { display:flex; align-items:flex-start; gap:10px; margin-top:14px; cursor:pointer; }
.nxm-checkbox-wrap input { margin-top:2px; accent-color:var(--nxm-primary); width:16px; height:16px; cursor:pointer; }
.nxm-checkbox-label { font-size:13px; color:var(--nxm-muted); line-height:1.5; }

/* NAV BUTTONS */
.nxm-nav { display:flex; justify-content:space-between; align-items:center; margin-top:28px; padding-top:20px; border-top:1px solid var(--nxm-border); }
.nxm-btn { display:inline-flex; align-items:center; gap:6px; padding:12px 28px; border-radius:10px; font-size:14px; font-weight:600; cursor:pointer; border:none; transition:all .2s; font-family:inherit; }
.nxm-btn-prev { background:#eaeaea; border:1.5px solid #d0d0d0; color:var(--nxm-dark); }
.nxm-btn-prev:hover { background:#d8d8d8; }
.nxm-btn-next { background:var(--nxm-primary); color:#fff; margin-left:auto; }
.nxm-btn-next:hover { background:#09285a; transform:translateY(-1px); box-shadow:0 4px 14px rgba(11,53,105,.28); }
.nxm-btn-submit { background:linear-gradient(135deg, var(--nxm-primary), #0d4a8a); color:#fff; margin-left:auto; border:none; }
.nxm-btn-submit:hover { transform:translateY(-1px); box-shadow:0 4px 18px rgba(11,53,105,.32); }
.nxm-btn:disabled { opacity:.6; cursor:not-allowed; transform:none !important; }

/* ERROR */
.nxm-input.error, .nxm-textarea.error {
  border-color: #EF4444;
  box-shadow: 0 0 0 3px rgba(239,68,68,.10);
}
.nxm-error-msg { font-size:11.5px; color:#EF4444; margin-top:4px; display:none; }
.nxm-error-msg.visible { display:block; }

/* SUCCESS */
.nxm-success { text-align:center; padding:60px 24px; background:linear-gradient(135deg,#eaf0fa,#dce8f8); border:2px solid #b8cfe8; border-radius:16px; }
.nxm-success-icon { font-size:60px; margin-bottom:16px; }
.nxm-success-title { font-size:24px; font-weight:800; color:var(--nxm-primary); margin:0 0 10px; }
.nxm-success-msg { font-size:15px; color:var(--nxm-dark); margin:0 0 6px; }
.nxm-success-email { font-size:13px; color:var(--nxm-muted); }
.nxm-success-sub { font-size:13px; color:var(--nxm-muted); }

/* ── Logo Upload Step ──────────────────────────── */
.nxm-upload-zone {
  border: 2px dashed #b8cfe8;
  border-radius: 14px;
  padding: 40px 24px;
  text-align: center;
  cursor: pointer;
  background: #f5f7fa;
  transition: all .2s;
  position: relative;
}
.nxm-upload-zone:hover, .nxm-upload-zone.nxm-upload-drag {
  border-color: #0b3569;
  background: #eaf0fa;
}
.nxm-upload-icon { margin-bottom: 12px; }
.nxm-upload-title { font-size: 16px; font-weight: 700; color: #0b3569; margin: 0 0 6px; }
.nxm-upload-sub   { font-size: 13px; color: #6B7280; margin: 0; }

.nxm-file-preview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 14px;
  margin-top: 20px;
}
.nxm-file-card {
  background: #fff;
  border: 1.5px solid #eaeaea;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  transition: box-shadow .2s;
}
.nxm-file-card:hover { box-shadow: 0 4px 16px rgba(11,53,105,.10); }

.nxm-file-thumb {
  height: 110px;
  background: #eaf0fa center/cover no-repeat;
  display: flex; align-items: center; justify-content: center;
}
.nxm-file-thumb-doc { background: #0b3569; }
.nxm-file-type-badge {
  background: rgba(255,255,255,.15);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  padding: 4px 12px;
  border-radius: 6px;
  letter-spacing: 1px;
}
.nxm-file-thumb[style*="url"] .nxm-file-type-badge { display: none; }

.nxm-file-meta { padding: 8px 10px; }
.nxm-file-name { font-size: 12px; font-weight: 600; color: #0F172A; margin: 0 0 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nxm-file-size { font-size: 11px; color: #9CA3AF; margin: 0; }

.nxm-file-remove {
  position: absolute; top: 6px; right: 6px;
  background: rgba(11,53,105,.85); color: #fff;
  border: none; border-radius: 50%;
  width: 22px; height: 22px;
  font-size: 14px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background .2s;
}
.nxm-file-remove:hover { background: #DC2626; }

.nxm-upload-msg { font-size: 13px; margin: 10px 0 0; font-weight: 600; }
.nxm-upload-msg-ok   { color: #059669; }
.nxm-upload-msg-warn { color: #D97706; }

.nxm-logo-none-wrap { margin-top: 20px; }