/*
 * Developmizer — Account Portal CSS
 *
 * Minimal shell for the user-facing account portal. Reuses everything
 * from dmz-core.css plus a narrower centered layout. Extend as needed.
 */

.dmz-account{
  min-height:100vh;
  display:flex;flex-direction:column;
  background:var(--dmz-bg-primary);
}

.dmz-account__header{
  padding:20px 28px;
  border-bottom:1px solid var(--dmz-border);
  background:var(--dmz-bg-secondary);
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;
}

.dmz-account__brand{
  display:flex;align-items:center;gap:10px;
  font-family:var(--dmz-font-heading);
  font-weight:700;
  color:var(--dmz-text-primary);
}
.dmz-account__brand-logo{
  width:28px;height:28px;
  border-radius:6px;
  background:var(--dmz-accent);
  color:var(--dmz-accent-text);
  display:flex;align-items:center;justify-content:center;
}

.dmz-account__content{
  flex:1;
  max-width:720px;
  margin:0 auto;
  width:100%;
  padding:32px 24px 64px;
}

.dmz-account__nav{
  display:flex;gap:4px;
  padding:4px;
  background:var(--dmz-bg-tertiary);
  border-radius:var(--dmz-radius-md);
  margin-bottom:24px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

.dmz-account__nav-btn{
  padding:8px 16px;
  border-radius:var(--dmz-radius-sm);
  border:none;background:none;
  color:var(--dmz-text-secondary);
  font-size:13px;font-weight:500;
  cursor:pointer;
  transition:color 0.15s ease,background 0.15s ease;
  white-space:nowrap;
}
.dmz-account__nav-btn:hover{color:var(--dmz-text-primary)}
.dmz-account__nav-btn--active{background:var(--dmz-bg-primary);color:var(--dmz-text-accent)}

@media(max-width:640px){
  .dmz-account__header{padding:14px 16px}
  .dmz-account__content{padding:20px 16px 40px}
}

/* ── Portal home (alpha 10.22 — Tier 1 session 1) ──
 *
 * Welcome screen with a header line and a grid of feature cards.
 * Cards are placeholders in v1; in subsequent sessions they become
 * real links to proposals/files/projects/messages surfaces. */
.dmz-portal-home{max-width:980px;margin:0 auto;padding:24px 16px 48px}
.dmz-portal-home__header{margin-bottom:32px}
.dmz-portal-home__header h1{margin:0 0 8px}
.dmz-portal-home__cards{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
    gap:16px;
}
.dmz-portal-home__card{
    padding:20px;
    background:var(--dmz-bg-elevated);
    border:1px solid var(--dmz-border);
    border-radius:var(--dmz-radius-md);
    display:flex;flex-direction:column;align-items:flex-start;
    transition:border-color .15s ease,transform .15s ease;
}
.dmz-portal-home__card:hover{border-color:var(--dmz-accent-medium)}
.dmz-portal-home__card-icon{
    width:36px;height:36px;
    display:flex;align-items:center;justify-content:center;
    background:var(--dmz-accent-faint);
    color:var(--dmz-accent);
    border-radius:8px;
    margin-bottom:12px;
}
.dmz-portal-home__card h3{margin:0 0 6px}
.dmz-portal-home__card p{margin:0 0 12px;flex:1}
.dmz-portal-home__footer{margin-top:32px;text-align:center;color:var(--dmz-text-muted)}

/* Mobile tightening */
@media (max-width:640px){
    .dmz-portal-home{padding:16px 12px 36px}
    .dmz-portal-home__cards{grid-template-columns:1fr}
}

/* ── Portal proposals (alpha 10.25 — Tier 1 session 2) ──
 *
 * Shared portal-page wrapper: header + content. Used by proposals,
 * and will be used by future portal pages (projects, files, messages). */
.dmz-portal-page{max-width:980px;margin:0 auto;padding:24px 16px 48px}
.dmz-portal-page__header{margin-bottom:24px}
.dmz-portal-page__header h1{margin:0 0 6px}

/* Make the proposals home-page card look clickable. */
.dmz-portal-home__card--clickable{
    cursor:pointer;text-align:left;
    border:1px solid var(--dmz-border);
    background:var(--dmz-bg-elevated);
    transition:border-color .15s ease,transform .1s ease,box-shadow .15s ease;
    width:100%;
    font:inherit;color:inherit;
}
.dmz-portal-home__card--clickable:hover{
    border-color:var(--dmz-accent-medium);
    box-shadow:0 1px 3px rgba(0,0,0,.06),0 4px 12px rgba(0,0,0,.04);
}
.dmz-portal-home__card-cta{
    display:inline-flex;align-items:center;gap:4px;
    margin-top:auto;padding-top:8px;
    color:var(--dmz-accent);font-size:13px;font-weight:600;
}

/* Proposals list — clickable rows. */
.dmz-portal-list{display:flex;flex-direction:column;gap:8px}
.dmz-portal-list__row{
    display:flex;justify-content:space-between;align-items:center;gap:16px;
    width:100%;padding:14px 16px;
    background:var(--dmz-bg-elevated);
    border:1px solid var(--dmz-border);border-radius:var(--dmz-radius-md);
    cursor:pointer;text-align:left;
    transition:border-color .15s ease,box-shadow .15s ease;
    font:inherit;color:inherit;
}
.dmz-portal-list__row:hover{
    border-color:var(--dmz-accent-medium);
    box-shadow:0 1px 3px rgba(0,0,0,.04);
}
.dmz-portal-list__main{flex:1;min-width:0}
.dmz-portal-list__title{font-size:15px;font-weight:600;color:var(--dmz-text-primary);margin-bottom:4px}
.dmz-portal-list__meta{display:flex;flex-wrap:wrap;gap:12px}
.dmz-portal-list__side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0}
.dmz-portal-list__total{font-size:15px;font-weight:600;color:var(--dmz-text-primary)}

/* Proposal detail. */
.dmz-portal-detail__header{margin-bottom:20px}
.dmz-portal-detail__section{margin-bottom:24px}
.dmz-portal-detail__section h2{margin:0 0 10px;font-size:15px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--dmz-text-secondary)}
.dmz-portal-detail__cover{
    padding:16px;background:var(--dmz-bg-tertiary);
    border-radius:var(--dmz-radius-md);
    line-height:1.7;font-size:15px;
}
.dmz-portal-detail__cover p{margin:0 0 12px}
.dmz-portal-detail__cover p:last-child{margin-bottom:0}

.dmz-portal-detail__items{
    width:100%;border-collapse:collapse;
    background:var(--dmz-bg-elevated);
    border:1px solid var(--dmz-border);border-radius:var(--dmz-radius-md);
    overflow:hidden;
}
.dmz-portal-detail__items td{padding:12px 16px;border-bottom:1px solid var(--dmz-border-light);vertical-align:top}
.dmz-portal-detail__items tr:last-child td{border-bottom:none}
.dmz-portal-detail__section-row td{
    background:var(--dmz-bg-tertiary);
    font-size:13px;text-transform:uppercase;letter-spacing:.04em;
}
.dmz-portal-detail__note-row td{
    background:transparent;
    padding:8px 16px;
}

.dmz-portal-detail__totals{
    margin:16px 0 24px;
    margin-left:auto;
    max-width:360px;
}
.dmz-portal-detail__totals table{width:100%;border-collapse:collapse}
.dmz-portal-detail__totals td{padding:6px 0}
.dmz-portal-detail__totals-grand td{
    border-top:2px solid var(--dmz-border);
    padding-top:10px;font-size:16px;
}

.dmz-portal-detail__actions{
    margin-top:32px;padding:20px;
    background:var(--dmz-bg-elevated);
    border:1px solid var(--dmz-border);border-radius:var(--dmz-radius-md);
}
.dmz-portal-detail__sign-box label{display:block;margin-bottom:6px;font-size:13px;font-weight:500}

/* Status banners. */
.dmz-banner{
    display:flex;align-items:flex-start;gap:12px;
    padding:14px 16px;margin:0 0 24px;
    border-radius:var(--dmz-radius-md);border:1px solid transparent;
}
.dmz-banner--success{background:rgba(16,185,129,.08);border-color:rgba(16,185,129,.3);color:#047857}
.dmz-banner--success svg{color:#047857;flex-shrink:0;margin-top:2px}
.dmz-banner--danger{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.3);color:#b32d2e}
.dmz-banner--danger svg{color:#b32d2e;flex-shrink:0;margin-top:2px}
.dmz-banner--warning{background:rgba(234,179,8,.08);border-color:rgba(234,179,8,.3);color:#854d0e}
.dmz-banner--warning svg{color:#854d0e;flex-shrink:0;margin-top:2px}

/* Mobile. */
@media (max-width:640px){
    .dmz-portal-page{padding:16px 12px 36px}
    .dmz-portal-list__row{padding:12px}
    .dmz-portal-list__side{align-items:flex-start}
    .dmz-portal-detail__totals{max-width:100%}
}

/* ── Portal projects (alpha 10.28 — Tier 1 session 3) ──
 *
 * Progress bars on list rows + project detail. Uses the org accent for
 * the fill so it matches the agency's brand. */
.dmz-portal-progress{display:flex;align-items:center;gap:10px}
.dmz-portal-progress__bar{
    flex:1;height:6px;
    background:var(--dmz-bg-tertiary);
    border-radius:999px;overflow:hidden;
    min-width:80px;
}
.dmz-portal-progress__fill{
    height:100%;
    background:var(--dmz-accent);
    border-radius:999px;
    transition:width .3s ease;
}
.dmz-portal-progress--lg .dmz-portal-progress__bar{height:10px}
.dmz-portal-progress--lg{gap:14px}

/* Vertical timeline of milestones in project detail.
 * Each item: a numbered/checked dot in a left column, content on the right.
 * Continuous vertical line connects the dots. */
.dmz-portal-timeline{
    position:relative;
    padding-left:8px;
}
.dmz-portal-timeline::before{
    content:'';
    position:absolute;
    left:15px;top:8px;bottom:8px;
    width:2px;
    background:var(--dmz-border);
    z-index:0;
}
.dmz-portal-timeline__item{
    position:relative;
    padding:10px 0 10px 40px;
}
.dmz-portal-timeline__dot{
    position:absolute;
    left:8px;top:14px;
    width:16px;height:16px;
    border-radius:50%;
    background:var(--dmz-bg-elevated);
    border:2px solid var(--dmz-border);
    z-index:1;
    display:flex;align-items:center;justify-content:center;
    color:#fff;
}
.dmz-portal-timeline__dot--active{
    border-color:var(--dmz-accent);
    background:var(--dmz-accent-faint);
}
.dmz-portal-timeline__dot--done{
    border-color:var(--dmz-accent);
    background:var(--dmz-accent);
}
.dmz-portal-timeline__dot--done svg{color:var(--dmz-accent-text)}
.dmz-portal-timeline__content{
    padding:6px 0;
}

/* Team list: chip with avatar + name. */
.dmz-portal-team-list{
    display:flex;flex-wrap:wrap;gap:10px;
}
.dmz-portal-team-chip{
    display:inline-flex;align-items:center;gap:8px;
    padding:6px 12px 6px 6px;
    background:var(--dmz-bg-tertiary);
    border-radius:999px;
    font-size:13px;
}

/* Source-proposal back-link card. */
.dmz-portal-source-link{
    display:flex;align-items:center;gap:12px;
    padding:14px 16px;
    background:var(--dmz-bg-elevated);
    border:1px solid var(--dmz-border);
    border-radius:var(--dmz-radius-md);
    text-decoration:none;color:inherit;
    transition:border-color .15s ease;
}
.dmz-portal-source-link:hover{border-color:var(--dmz-accent-medium)}
.dmz-portal-source-link > div{flex:1;min-width:0}
.dmz-portal-source-link svg{flex-shrink:0;color:var(--dmz-accent)}

@media (max-width:640px){
    .dmz-portal-timeline__item{padding-left:36px}
    .dmz-portal-timeline::before{left:13px}
    .dmz-portal-timeline__dot{left:6px}
}