/* AideaMaker client portal. */

/* ---- layout -------------------------------------------------------------- */
body.portal{display:flex;flex-direction:column;min-height:100vh;background:var(--mist);font-size:15px}

/* Menu bar contained within the 1350px column (not full-bleed). */
.portal-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  background:var(--ink);color:#cdd9e4;padding:0 1.4rem;
  position:sticky;top:0;z-index:60;border-bottom:1px solid rgba(255,255,255,.08);
  width:100%;max-width:1350px;margin-inline:auto}
.portal-brand{display:flex;align-items:center;gap:.5rem;padding:.7rem 0;color:#fff;
  font-family:var(--sans);font-weight:700;flex:none;text-decoration:none}
.portal-brand small{color:var(--spark);font-weight:600;font-size:.7rem;text-transform:uppercase;letter-spacing:.06em}

.portal-nav{display:flex;align-items:center;gap:1.2rem}
.portal-nav a{color:#cdd9e4;text-decoration:none;font-size:.92rem;padding:.5rem .6rem;border-radius:8px}
.portal-nav a:hover{background:rgba(255,255,255,.07);color:#fff}
.portal-nav a.active{color:#fff;font-weight:600;box-shadow:inset 0 -2px 0 var(--spark)}
.portal-account{display:flex;align-items:center;gap:.8rem;border-left:1px solid rgba(255,255,255,.15);margin-left:.4rem;padding-left:1rem}
.portal-who{color:#cdd9e4;font-size:.85rem}

.portal-main{flex:1;padding:1.8rem 1.4rem;max-width:900px;width:100%;margin:0 auto}
.portal-body{width:100%}

.portal-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem;margin-bottom:1.2rem;box-shadow:var(--shadow)}

/* ---- login page ---------------------------------------------------------- */
body.portal.login-page{display:flex;align-items:center;justify-content:center}
.login-wrap{max-width:380px;width:100%;padding:2rem}
.login-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:2rem;box-shadow:var(--shadow)}

/* ---- form + flash (mirrors admin.css) ------------------------------------ */
.aform label{display:block;font-weight:600;font-size:.85rem;margin:.8rem 0 .3rem}
.aform input,.aform select,.aform textarea{width:100%;padding:.55rem .7rem;border:1px solid var(--line);border-radius:8px;font:inherit}
.aform input:focus,.aform select:focus,.aform textarea:focus{outline:none;border-color:var(--spark);box-shadow:0 0 0 3px rgba(24,194,230,.18)}
.aform .row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.flash{padding:.7rem 1rem;border-radius:8px;background:rgba(30,158,106,.12);color:var(--success);margin-bottom:1rem;font-weight:600}
.muted{color:var(--slate)}
.btn-sm{padding:.4em .8em;font-size:.85rem;border-radius:8px}

/* ---- timeline stepper ---------------------------------------------------- */
.pj-timeline{position:relative;padding:0;list-style:none;margin:1.5rem 0}
.pj-timeline::before{content:'';position:absolute;left:18px;top:0;bottom:0;width:2px;background:var(--line)}
.pj-step{position:relative;padding:.15rem 0 1.2rem 52px}
.pj-dot{position:absolute;left:0;top:.15rem;width:38px;height:38px;border-radius:50%;display:flex;
  align-items:center;justify-content:center;font-weight:700;font-size:.82rem;z-index:1}
.pj-dot--done{background:var(--acc-win);color:#fff}
.pj-dot--active{background:var(--brand-600);color:#fff;box-shadow:0 0 0 4px color-mix(in srgb,var(--brand-600) 20%,transparent)}
.pj-dot--pending{background:var(--mist);color:var(--slate);border:2px solid var(--line)}
.pj-step h3{font-size:1rem;margin:0 0 .2rem}
.pj-step p{font-size:.88rem;color:var(--slate);margin:0 0 .5rem}
.pj-step.done .pj-step-title{color:var(--slate)}

/* ---- onboarding choice cards --------------------------------------------- */
.onb-choices{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-top:1.2rem}
.onb-choice{background:var(--paper);border:2px solid var(--line);border-radius:var(--radius);
  padding:1.4rem;cursor:pointer;text-decoration:none;color:inherit;transition:border-color .18s,box-shadow .18s}
.onb-choice:hover{border-color:var(--brand-600);box-shadow:0 4px 16px rgba(0,0,0,.08)}
.onb-choice h3{font-size:1.05rem;margin:0 0 .4rem}
.onb-choice p{font-size:.88rem;color:var(--slate);margin:0}
.onb-choice-icon{font-size:2rem;margin-bottom:.7rem}

/* ---- chat surface -------------------------------------------------------- */
.onb-chat{display:flex;flex-direction:column;height:calc(100vh - 160px);min-height:400px}
.onb-messages{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.6rem}
.onb-msg{max-width:82%;padding:.7rem 1rem;border-radius:14px;font-size:.9rem;line-height:1.5}
.onb-msg.user{align-self:flex-end;background:var(--brand-600);color:#fff;border-bottom-right-radius:4px}
.onb-msg.assistant{align-self:flex-start;background:var(--paper);border:1px solid var(--line);border-bottom-left-radius:4px}
.onb-input-row{display:flex;gap:.6rem;padding:.8rem;border-top:1px solid var(--line);background:var(--mist)}
.onb-input{flex:1;padding:.6rem .8rem;border:1px solid var(--line);border-radius:8px;font:inherit;resize:none;
  min-height:42px;max-height:120px;overflow-y:auto}
.onb-input:focus{outline:none;border-color:var(--brand-600)}
.onb-send{padding:.6rem 1.1rem;background:var(--brand-600);color:#fff;border:0;border-radius:8px;cursor:pointer;font-weight:600}
.onb-send:hover{background:var(--brand-700)}
.onb-send:disabled{opacity:.5;cursor:not-allowed}
.onb-typing{color:var(--slate);font-size:.82rem;font-style:italic;padding:.3rem .6rem}

@media(max-width:600px){
  .portal-bar{flex-wrap:wrap;padding:.7rem 1rem}
  .portal-nav{gap:.6rem;flex-wrap:wrap}
  .onb-choices{grid-template-columns:1fr}
  .aform .row{grid-template-columns:1fr}
}