/* ===== Theme tokens ===== */
:root{--bg:#0f0f0f;--panel:#121212;--muted:#cfcfcf;--text:#f2f2f2;--accent:#ff2a2a;--accent-400:#ff4d4d;--accent-700:#b11616;--accent-ghost:rgba(255,42,42,.10);--ring:rgba(255,255,255,.18);--radius:14px;--card-bg:#160a0a;--card-active:#1c0c0c;--chip-bg:#221111;}

/* ===== Container / Header ===== */
html body .mp-wrap{color:var(--text);background:var(--bg);border-radius:var(--radius);padding:20px;max-width:1100px;margin:0 auto;box-shadow:0 0 0 1px rgba(255,255,255,.06) inset,0 20px 40px rgba(0,0,0,.25)}
html body .mp-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
html body .mp-title{font-weight:800;letter-spacing:.2px}
html body .mp-step{opacity:.8}

/* ===== Panels ===== */
html body .mp-panel{display:block;padding:8px 0}
html body .mp-panel[aria-hidden="true"]{display:none}
html body .mp-panel-title{margin:.25rem 0 .5rem;font-size:1.12rem;color:#fff}
html body .mp-panel-subtitle{margin:.75rem 0 .5rem;font-size:1rem;color:#fff}
html body .mp-instruction{color:var(--muted);margin-bottom:.5rem}
html body .mp-hint{color: #fff;min-height: 1.25rem;text-align: right;margin-top: 50px;margin-bottom: -10px;}
html body .mp-hint.mp-error{color:#a20000;padding:8px 10px;border-radius:10px}

/* ===== User form ===== */
html body .mp-form-grid{display:grid;gap:14px;grid-template-columns:1fr}
@media (min-width:780px){html body  .mp-form-grid{grid-template-columns:repeat(3,1fr);} }
html body .mp-field span{display:block;margin:0 0 .25rem}
html body .mp-field input{width:100%;padding:14px;border-radius:12px;border:2px solid #2a2a2a;background:#151515;color:#fff!important;box-sizing: border-box;}
html body .mp-field input:focus{outline:3px solid var(--ring)}

/* Upload */
html body .mp-upload{margin-top:16px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:10px;align-items:center}
html body .mp-upload-label{grid-column:1 / -1}
html body .mp-btn-file{display:inline-block;background:var(--accent);color:#111;font-weight:800;border:0;padding:10px 14px;border-radius:12px;cursor:pointer;box-shadow:0 6px 16px rgba(255,42,42,.15)}
html body .mp-photo-input{position:absolute;left:-9999px}
html body .mp-photo-filename{color:#aaa;margin-left:8px}
html body .mp-photo-preview{grid-column:1 / -1;display:flex;align-items:center;gap:12px;background:#0f0f0f;border:1px dashed #333;border-radius:12px;padding:10px}
html body #mp-photo-preview{width:64px;height:64px;object-fit:cover;border-radius:50%;display:none;border:2px solid #2b2b2b;background:#111}
html body .mp-photo-placeholder svg{display:block}
html body .mp-photo-placeholder.small svg{width:56px;height:56px}
html .mp-profile-wrap .mp-submit-row {
    position: unset;
    margin-top: 20px !important;
}
html body .mp-profile-wrap span#mp-send-msg {
    margin-top: 0;
    line-height: 50px;
    margin-right: 20px;
    color: #00ff00;
	    padding: 0;
}
html body .mp-profile-wrap span#mp-send-msg.mp-error {
    color: #a20000;
}
/* ===== Choice grid ===== */
html body .mp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (min-width:720px){ html body .mp-grid{grid-template-columns:repeat(4,minmax(0,1fr));} 
html body #mp-summary .mp-grid {
  grid-template-columns: repeat(3,minmax(0,1fr));
}
 }
@media (max-width:540px){ html body .mp-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
html body .mp-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:720px){ html body .mp-grid-3{grid-template-columns:1fr}}

/* Multi-select card */
html body .mp-choice{position:relative;display:flex;gap:.8rem;align-items:center; /* vertical center */
padding:16px;border:2px solid var(--accent-700);border-radius:12px;background:var(--card-bg);color:var(--text);cursor:pointer;transition:.18s border-color,.18s background,.18s box-shadow}
html body .mp-choice:hover{border-color:var(--accent-400);background:var(--accent-ghost)}
html body .mp-choice:focus-visible{outline:3px solid var(--ring);outline-offset:2px}
html body .mp-choice[aria-pressed="true"]{background:linear-gradient(0deg, rgba(255,42,42,.14), rgba(255,42,42,.14)), var(--card-active);border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset,0 6px 14px rgba(255,42,42,.10)}
/* A–P badge */
html body .mp-choice .mp-kbd{flex:0 0 auto;font-weight:800;border:2px solid var(--accent-700);color:var(--text);border-radius:10px;width:32px;height:32px;display:grid;place-items:center;background:#240909}
/* make badge red when selected */
html body .mp-choice[aria-pressed="true"] .mp-kbd{background:var(--accent);color:#111;border-color:var(--accent)}
/* left-aligned text */
html body .mp-choice .mp-label{line-height:1.45;letter-spacing:.2px;text-align:left}
/* Tick */
html body .mp-choice .mp-tick{position:absolute;right:10px;top:10px;width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;display:none;align-items:center;justify-content:center;font-weight:900}
html body .mp-choice[aria-pressed="true"] .mp-tick{display:flex}

/* ===== Primary (radio) ===== */
html body .mp-primary{display:grid;gap:14px;grid-template-columns:repeat(3,1fr)}
@media (min-width:900px){ .mp-primary{grid-template-columns:repeat(3,1fr);} }
html body .mp-primary h3{margin:.25rem 0 .35rem;color:#fff;}
html body .mp-radio-grid{display:grid;gap:12px}
html body .mp-radio{min-height:75px;position:relative;display:flex;gap:.8rem;align-items:center;padding:16px;border:2px solid var(--accent-700);border-radius:12px;background:#120a0a;color:var(--text);cursor:pointer;transition:.18s border-color,.18s background}
html body .mp-radio:hover{border-color:var(--accent-400);background:var(--accent-ghost)}
html body .mp-radio:focus-visible{outline:3px solid var(--ring);outline-offset:2px}
html body .mp-radio[aria-checked="true"]{background:linear-gradient(0deg, rgba(255,42,42,.14), rgba(255,42,42,.14)), #140909;border-color:var(--accent)}
html body .mp-radio .mp-dot{width:18px;height:18px;max-width:18px;max-height:18px;min-width:18px;min-height:18px;border-radius:50%;border:2px solid var(--accent-400);margin-top:2px}
html body .mp-radio[aria-checked="true"] .mp-dot{background:var(--accent);border-color:var(--accent)}
html body .mp-radio .mp-label{line-height:1.45}

/* ===== Step 6 review bar ===== */
html body .mp-review{display:grid;grid-template-columns:1.2fr 1fr;gap:14px;border:1px solid #291313;background:#140a0a;padding:14px;border-radius:12px;margin:6px 0 14px}
html body .mp-review-left{display:flex;gap:12px;align-items:center}
html body .mp-user-photo.circle img{width:64px;height:64px;border-radius:50%;object-fit:cover;border:2px solid #2b2b2b;background:#111;display:none}
html body #mp-userbar-photo-placeholder{display:flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;border:2px solid #2b2b2b;background:#111}
html body .mp-user-name{font-weight:800}
html body .mp-user-email,.mp-user-phone{opacity:.9}
html body .mp-review-right{display:flex;align-items:center;justify-content:flex-end}
html body .mp-primary-chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
html body .mp-chip{background:var(--chip-bg);color:var(--accent-700);padding:6px 10px;font-weight:700}

/* Summary cards */
html body .mp-grid-3 .mp-choice{min-height:62px}

/* Nav */
html body .mp-nav{display:flex;justify-content:space-between;gap:12px;margin-top:16px}
html body .mp-btn{background:#1a0d0d;color:var(--text);border:2px solid var(--accent-700);padding:12px 18px;border-radius:12px;cursor:pointer;transition:.18s}
html body .mp-btn:hover{border-color:var(--accent-400)}
html body .mp-btn:disabled{opacity:.45;cursor:not-allowed}

/* Single submit row (step 6) */
html body .mp-submit-row {display: flex;position: absolute;right: 20px;bottom: 20px;    flex-direction: row-reverse;}
html body span#mp-submit-msg {line-height: 40px;margin-right: 20px;}

html body .mp-submit{background:#1e0c0c}

/* Hide Next button on step 6 so there’s only one Submit */
html body .mp-wrap[data-step="6"] .mp-next{display:none}


/* ==== Tier-specific accent overrides ==== */
/* Step 2 — Tier 1 grid (green) */
html body .mp-panel[data-panel="2"]{--accent:#00ff00; --accent-400:#00ff00; --accent-700:#00cc00; --accent-ghost:rgba(0,255,0,.12);--card-bg:#0f1a0f; --card-active:#0f220f; --chip-bg:#0f1a0f;}
/* Step 3 — Tier 2 grid (blue) */
html body .mp-panel[data-panel="3"]{--accent:#3366ff; --accent-400:#3366ff; --accent-700:#2547b8; --accent-ghost:rgba(51,102,255,.12);--card-bg:#0f111a; --card-active:#0f1422; --chip-bg:#0f111a;}
/* Step 4 — Tier 3 grid (red) */
html body .mp-panel[data-panel="4"]{--accent:#ff0000; --accent-400:#ff0000; --accent-700:#b80000; --accent-ghost:rgba(255,0,0,.12);--card-bg:#160a0a; --card-active:#1c0c0c; --chip-bg:#221111;}

/* Step 5 — Primary pick radios get per-tier colors */
html body #mp-radio-1{ --accent:#00ff00; --accent-400:#00ff00; --accent-700:#00cc00; --accent-ghost:rgba(0,255,0,.12); }
html body #mp-radio-2{ --accent:#3366ff; --accent-400:#3366ff; --accent-700:#2547b8; --accent-ghost:rgba(51,102,255,.12); }
html body #mp-radio-3{ --accent:#ff0000; --accent-400:#ff0000; --accent-700:#b80000; --accent-ghost:rgba(255,0,0,.12); }

/* Step 6 — summary chips/cards colored per tier classes */
html body .mp-chip.tier1,html body .mp-choice.tier1{ --accent:#00ff00; --accent-400:#00ff00; --accent-700:#00cc00; --chip-bg:rgba(0,255,0,.10); }
html body .mp-chip.tier2,html body .mp-choice.tier2{ --accent:#3366ff; --accent-400:#3366ff; --accent-700:#2547b8; --chip-bg:rgba(51,102,255,.10); }
html body .mp-chip.tier3,html body .mp-choice.tier3{ --accent:#ff0000; --accent-400:#ff0000; --accent-700:#b80000; --chip-bg:rgba(255,0,0,.10); }

/* Global: Prev/Next/Submit border + text color red */
html body .mp-btn,html body .mp-submit {
    
    border-color: #ff0000 !important;
    color: #ff0000 !important;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 600;
}
html body .mp-btn:hover,html body .mp-submit:hover { border-color:#ff0000 !important; }



/* Badges (Coach / UID) */
.mp-badge{
  display:inline-block;
  background:#1a0d0d;
  color:#fff;
  border:2px solid var(--accent-700);
  padding:6px 10px;
  border-radius:999px;
  font-weight:700;
  margin-left:6px;
}

/* Step-6 right meta container */
.mp-meta-right{ display:flex; gap:8px; align-items:center; }

/* Use list bullets on results/profile stacks */
.mp-col-list{ list-style:disc; margin:0 0 0 18px; padding:0; }


button#mp-generate {
    order: 2;
    margin-left: 20px;
}

span#mp-gen-msg {
    order: 1;
	margin-top:15px
}



.mp-actions button {
  line-height: 28px;
  margin-bottom: 5px;
  min-width: 100px;
  border-radius: 4px;
  box-shadow: none !important;
  outline: none;
  background: #fff;
  cursor: pointer;
}
.mp-actions  .button-link-delete {
  border-color: #d63638;
  outline: none;
}
.mp-actions  form {
  border: none;
  box-shadow: none;
}
.mp-admin-card form label input {
  margin-left: 10px;
  padding: 0 10px;
}
.mp-admin-card form label br {
  display: none;
}
.mp-admin-card {
  margin-bottom: 10px;
}






.mp-wrap{max-width:900px;margin:0 auto;padding:16px}
.mp-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.mp-panel{margin:14px 0}
.mp-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mp-field input{width:100%;padding:10px;border:1px solid #ccc;border-radius:6px}
.mp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mp-choice,.mp-radio{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid #ddd;border-radius:8px;background:#fff;cursor:pointer}
.mp-choice[aria-pressed="true"]{outline:2px solid #7c3aed}
.mp-radio[aria-checked="true"]{outline:2px solid #7c3aed}
.mp-btn{display:inline-block;padding:10px 14px;background:#111;color:#fff;border-radius:8px;border:none;cursor:pointer}
.mp-hint{margin-top:8px;min-height:20px}
.mp-hint.mp-error{color:#c00}
.mp-kbd{font-weight:700;background:#f5f5f5;padding:3px 7px;border-radius:6px}
.mp-tick{margin-left:auto}
.mp-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.mp-radio-grid{display:grid;grid-template-columns:1fr;gap:10px}
.hide{display:none!important;}

.mp-panel-subtitle.testClass {
  display: none;
}
#mp-primary-summary {
  display: none;
}


