/* ==========================================================================
   KCDC One — the public pages on the kit (UX-PUBLIC-b; UX assessment §4.22).
   Loaded by PublicPages::enqueue() after console-kit.css and portal-one.css,
   only on pages that carry a public shortcode, and applies only under
   .npe-my-pub (every root is <div class="npe-my npe-my-pub">). Colours, sizes
   and radii are tokens from npe-tokens.css (through .npe-my): never a literal
   here. Light only. Breakpoints: 1080px and 720px, like the kit.
   Each later block is one screen; keep a new rule inside its block.
   ========================================================================== */

/* ---- frame + page header ---- */
.npe-my.npe-my-pub{display:flex;flex-direction:column;gap:var(--s4);max-width:1040px;min-width:0;margin:0 auto;padding:var(--s6) var(--s4) var(--s7);}
.npe-my-pub [hidden]{display:none!important;}
.npe-my-pub img{max-width:100%;}
/* the site theme pads headings and paragraphs; the kit spaces with margins and gaps */
.npe-my-pub h1,.npe-my-pub h2,.npe-my-pub h3,.npe-my-pub p,.npe-my-pub figure{padding:0;}
.npe-pub-head{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:var(--s4);}
.npe-pub-head>div{flex:1 1 320px;min-width:0;}
.npe-my-pub .npe-pub-head h1,.npe-my-pub .npe-pub-title{margin:0;font-family:var(--fdisp);font-weight:800;font-size:var(--t-h1);letter-spacing:-.03em;line-height:1.1;color:var(--fg0);overflow-wrap:anywhere;}
.npe-my-pub .npe-pub-head p{margin:var(--s1) 0 0;max-width:72ch;font-size:var(--t-title);color:var(--fg1);}
.npe-pub-back{display:inline-flex;align-items:center;align-self:flex-start;gap:var(--s1);min-height:var(--h-ctl);font-size:var(--t-body);font-weight:600;text-decoration:none;}
.npe-pub-back svg{width:16px;height:16px;}
.npe-pub-narrow{width:100%;max-width:720px;}
.npe-pub-stack{display:flex;flex-direction:column;gap:var(--s4);}
.npe-pub-lead{margin:0;font-size:var(--t-title);color:var(--fg1);}
.npe-pub-foot{margin:0;font-size:var(--t-sm);color:var(--fg2);}

/* the site theme styles h1–h3 inside page content with more weight than one class:
   say the kit's title rules again, one level heavier */
.npe-my-pub .npe-k-card__title,.npe-my-pub .npe-k-empty__title{margin:0;font-family:var(--fsans);font-size:var(--t-title);font-weight:700;letter-spacing:0;line-height:1.3;color:var(--fg0);}

/* ---- kit pieces console-kit.css scopes to .npe-console ---- */
.npe-my-pub .npe-c-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:var(--h-ctl);padding:0 var(--s4);border:1px solid var(--line);border-radius:var(--rbtn);background:var(--bg0);color:var(--fg0);font:inherit;font-size:var(--t-body);font-weight:600;text-decoration:none;cursor:pointer;}
.npe-my-pub .npe-c-btn.primary{background:var(--sig-fill);border-color:var(--sig-fill);color:var(--bg0);}
.npe-my-pub .npe-my-btn[disabled],.npe-my-pub .npe-c-btn[disabled]{opacity:.5;cursor:not-allowed;}
.npe-my-pub .npe-my-pill.is-crit{background:var(--crit-bg);color:var(--crit);}
.npe-my-pub .npe-k-empty .link{font-weight:600;}
.npe-my-pub .npe-k-note{margin:0;}

/* ---- form controls at the portal's 44px height and 16px text ---- */
.npe-my-pub .npe-k-field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.npe-my-pub .npe-k-field select,
.npe-my-pub .npe-k-field textarea{width:100%;min-height:var(--h-ctl);padding:0 var(--s3);box-sizing:border-box;border:1px solid var(--line2);border-radius:var(--rbtn);background:var(--bg0);color:var(--fg0);font-family:inherit;font-size:var(--t-touch);line-height:1.4;}
.npe-my-pub .npe-k-field textarea{min-height:120px;padding:var(--s2) var(--s3);resize:vertical;}
.npe-my-pub .npe-k-field input:focus,.npe-my-pub .npe-k-field select:focus,.npe-my-pub .npe-k-field textarea:focus{outline:none;border-color:var(--sig);box-shadow:0 0 0 3px var(--sig-glow);}
.npe-my-pub .npe-k-check input{flex:none;width:20px;height:20px;min-height:0;margin:0;accent-color:var(--sig);}
.npe-my-pub .npe-k-choice input{position:absolute;width:1px;height:1px;min-height:0;opacity:0;pointer-events:none;}
.npe-my-pub .npe-pub-fieldset legend{margin:0 0 6px;padding:0;font-size:var(--t-sm);font-weight:600;color:var(--fg0);}
.npe-my-pub .npe-k-form__status.is-error{color:var(--crit);}
.npe-my-pub .npe-k-form__actions .npe-my-btn{min-width:140px;}

@media (max-width:720px){
  .npe-my.npe-my-pub{padding:var(--s4) var(--s4) var(--s6);}
  .npe-my-pub .npe-pub-head h1,.npe-my-pub .npe-pub-title{font-size:var(--t-rec);}
  .npe-pub-head>.npe-my-btn{flex:1 1 100%;}
  .npe-my-pub .npe-k-form__actions .npe-my-btn{flex:1 1 100%;}
}

/* ---- Events: equal cards, 16:10 image, one pill row, buttons pinned to the foot (§4.22) ---- */
.npe-pub-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);align-items:stretch;}
.npe-pub-card__media{display:block;aspect-ratio:16 / 10;overflow:hidden;background:var(--bg1);border-bottom:1px solid var(--line);}
.npe-pub-card__media img{display:block;width:100%;height:100%;object-fit:cover;}
.npe-pub-card__media.is-empty{display:flex;align-items:center;justify-content:center;color:var(--fg2);}
.npe-pub-card__media.is-empty svg{width:32px;height:32px;}
.npe-pub-card__bd{display:flex;flex-direction:column;flex:1 1 auto;gap:var(--s2);min-width:0;padding:var(--s4);}
.npe-my-pub .npe-pub-card__title{margin:0;font-family:var(--fsans);font-size:var(--t-title);font-weight:700;letter-spacing:0;line-height:1.3;color:var(--fg0);overflow-wrap:anywhere;}
.npe-pub-card__title a{color:inherit;text-decoration:none;}
.npe-pub-card__title a:hover{color:var(--sig-text);}
.npe-pub-card__meta{display:flex;flex-direction:column;gap:2px;font-size:var(--t-sm);color:var(--fg1);}
.npe-pub-card__pills{display:flex;flex-wrap:wrap;gap:var(--s2);min-height:24px;}
.npe-pub-card__text{margin:0;font-size:var(--t-body);color:var(--fg1);}
.npe-pub-card__ft{display:flex;gap:var(--s2);margin-top:auto;padding:0 var(--s4) var(--s4);}
.npe-pub-card__ft .npe-my-btn{flex:1 1 0;}

/* event detail: key facts, the event's own text, rows of dates */
.npe-pub-facts{display:flex;flex-direction:column;margin:0;}
.npe-pub-facts>div{display:flex;flex-direction:column;gap:2px;padding:var(--s2) 0;border-bottom:1px solid var(--line);}
.npe-pub-facts>div:first-child{padding-top:0;}
.npe-pub-facts>div:last-child{border-bottom:0;padding-bottom:0;}
.npe-pub-facts dt{font-family:var(--fmono);font-size:var(--t-cap);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--fg2);}
.npe-pub-facts dd{margin:0;font-size:var(--t-body);color:var(--fg0);}
.npe-pub-prose{font-size:var(--t-title);color:var(--fg1);overflow-wrap:anywhere;}
.npe-pub-prose p{margin:0 0 var(--s3);}
.npe-pub-prose p:last-child{margin-bottom:0;}
.npe-pub-rows>div{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s2) var(--s3);min-height:56px;padding:var(--s2) var(--s4);border-bottom:1px solid var(--line);font-size:var(--t-body);}
.npe-pub-rows>div:last-child{border-bottom:0;}
.npe-pub-rows.is-inset>div{padding-left:0;padding-right:0;}
.npe-pub-rows__main{flex:1 1 200px;min-width:0;color:var(--fg0);}

@media (max-width:1080px){
  .npe-pub-cards{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:720px){
  .npe-pub-cards{grid-template-columns:minmax(0,1fr);}
  .npe-pub-rows>div>.npe-my-btn{flex:1 1 100%;}
}

/* ---- Giving: Givebutter's form with a loading line and a way out ---- */
.npe-pub-embed{min-height:120px;}
.npe-my-pub .npe-pub-embed__loading{margin:0;padding:var(--s6) 0;text-align:center;font-size:var(--t-body);color:var(--fg2);}
.npe-pub-embed[data-state="ready"] .npe-pub-embed__loading{display:none;}
.npe-pub-ft{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s2) var(--s3);}
.npe-pub-ft__end{margin-left:auto;font-size:var(--t-body);font-weight:600;}

@media (max-width:720px){
  .npe-pub-ft>.npe-my-btn{flex:1 1 100%;}
  .npe-pub-ft__end{display:inline-flex;align-items:center;min-height:var(--h-ctl);margin-left:0;}
}

/* ---- Forms that answer in place: what replaces the form when it is sent ---- */
.npe-pub-done{display:flex;flex-direction:column;gap:var(--s3);}
.npe-pub-done:focus{outline:none;}
.npe-my-pub .npe-pub-done p{margin:0;font-size:var(--t-title);color:var(--fg1);}
/* contact + partner interest: centred in the content column, like log in and register */
.npe-my-pub [data-npe-pub-contact]{margin-inline:auto;}

/* ---- Impact: a bar per month with its value on it and its month under it ---- */
.npe-pub-chart{margin:0;}
.npe-pub-bars{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:var(--s1);}
.npe-pub-bar{display:flex;flex-direction:column;align-items:center;gap:var(--s1);min-width:0;}
.npe-pub-bar__col{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:2px;width:100%;height:180px;}
.npe-pub-bar__col i{display:block;flex:none;width:100%;max-width:32px;height:calc(var(--npe-bar,0%) * .88);min-height:2px;border-radius:4px 4px 0 0;background:var(--npe-chart-1);}
.npe-pub-bar__val{font-family:var(--fmono);font-size:var(--t-cap);line-height:1.2;color:var(--fg1);white-space:nowrap;}
.npe-pub-bar__tick{display:flex;flex-direction:column;align-items:center;min-height:2.6em;font-family:var(--fmono);font-size:var(--t-cap);line-height:1.3;color:var(--fg2);}
.npe-pub-bar__tick small{font-size:inherit;}

/* Phone: My KCDC's three-across tiles break words and numbers mid-way in a ~300px column,
   so the public tiles go two across; twelve bars leave ~22px each, so a month shows under
   every other bar (the year under it stays). */
@media (max-width:720px){
  .npe-pub-bars{gap:2px;}
  .npe-my-pub [data-npe-pub-tiles] .npe-k-stats{grid-template-columns:repeat(2,minmax(0,1fr));}
  .npe-pub-bar:nth-child(even) .npe-pub-bar__mon{visibility:hidden;}
}

/* ---- Partner caseworker: add a client (a disclosure), one card per client ---- */
.npe-pub-disclose>summary{width:max-content;list-style:none;cursor:pointer;}
.npe-pub-disclose>summary::-webkit-details-marker{display:none;}
.npe-pub-disclose[open]>summary{margin-bottom:var(--s3);}
.npe-my-pub .npe-pub-disclose[open]>summary.is-primary{background:var(--bg0);border-color:var(--line);color:var(--fg0);} /* open, the form's own Save is the one primary */
.npe-pub-gap{margin-top:var(--s4);}
.npe-pub-client .npe-k-card__hd{align-items:flex-start;flex-wrap:wrap;}
.npe-pub-client .npe-k-card__hd>div{min-width:0;}
.npe-pub-client .npe-k-card__hd>div>.npe-my-muted{display:block;overflow-wrap:anywhere;}

@media (max-width:720px){
  .npe-pub-disclose>summary{width:100%;}
}