/* Texas Stands Together additions. Loads after site.css, which is shared with
   the sister site (Temple Stands Together). Covers the representative lookup,
   the pledge tracker, and the document packets. */

/* The lookup script shows and hides results with the hidden attribute.
   Components below set their own display, so hidden must win. */
[hidden] { display: none !important; }

/* ---------- Photo credits ----------
   Wikimedia Commons licenses require a visible credit on every photo. */
.col-card .col-figure { margin: -1.4rem -1.4rem 0; }
.col-card .col-figure .col-photo { margin: 0; }
.col-figure figcaption { padding: .45rem 1.4rem 0; font-size: .74rem; line-height: 1.4; color: var(--muted); }
.col-figure figcaption a, .photo figcaption a { color: inherit; }

/* ---------- Representative lookup ---------- */

.action-card {
  background: #fff; border: 1px solid var(--line); border-top: 5px solid var(--red);
  border-radius: var(--radius-lg); padding: clamp(1.4rem, 3vw, 2.1rem); box-shadow: var(--lift);
}
.action-card > h3 { font-family: var(--serif); font-weight: 700; font-size: clamp(1.35rem, 2.5vw, 1.7rem); color: var(--navy); }
.action-sub { margin-top: .4rem !important; color: var(--ink-2); }

.lookup-form { display: grid; gap: 1rem; margin-top: 1.25rem !important; }
.field-row { display: grid; grid-template-columns: minmax(0, 1fr) 160px; gap: 1rem; }
@media (max-width: 560px) { .field-row { grid-template-columns: 1fr; } }
.field { display: grid; gap: .35rem; }
.field label { font-weight: 700; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--navy); }
.field input {
  width: 100%; padding: .8rem .9rem; font: 1rem var(--sans); color: var(--ink);
  background: var(--sky-2); border: 1px solid var(--line-2); border-radius: var(--radius-sm);
}
.field input:focus { outline: 3px solid var(--gold); outline-offset: 1px; border-color: var(--gold-700); }
.field input::placeholder { color: #8C96A8; }
.lookup-form .btn { justify-self: start; }
.lookup-note { font-size: .86rem; color: var(--muted); }

.lookup-status {
  margin-top: 1.1rem !important; padding: .9rem 1.1rem; border-radius: var(--radius-sm);
  background: var(--sky); border: 1px solid var(--line-2); color: var(--ink-2); font-size: .93rem;
}
.lookup-status[data-tone="error"] { background: var(--red-50); border-color: #EDC4C1; color: var(--red-700); }

.rep-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; margin-top: 1.25rem !important; }
.rep-card { background: var(--sky-2); border: 1px solid var(--line); border-left: 4px solid var(--navy); border-radius: var(--radius-sm); padding: 1.15rem 1.2rem; }
.rep-chamber { display: block; font-weight: 800; font-size: .74rem; letter-spacing: .13em; text-transform: uppercase; color: var(--gold-700); }
.rep-name { margin-top: .25rem !important; font-family: var(--serif); font-weight: 700; font-size: 1.3rem; line-height: 1.2; color: var(--navy); }
.rep-meta { margin-top: .2rem !important; font-size: .88rem; color: var(--muted); }
.rep-links { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .85rem; }
.rep-links a {
  display: inline-flex; align-items: center; min-height: 40px; padding: .45rem .85rem; border-radius: var(--radius-sm);
  border: 1.5px solid var(--navy); color: var(--navy); font-weight: 700; font-size: .88rem; text-decoration: none;
}
.rep-links a:hover { background: var(--navy); color: #fff; }
.rep-links a.is-primary { background: var(--red); border-color: var(--red); color: #fff; }
.rep-links a.is-primary:hover { background: var(--red-700); border-color: var(--red-700); }

.disclosure { margin-top: 1.4rem !important; padding-top: 1.1rem; border-top: 1px solid var(--line); }
.disclosure > summary { cursor: pointer; font-weight: 700; color: var(--navy-700); }
.disclosure > p { margin-top: .8rem; }

/* ---------- Pledge tracker ---------- */

.tally { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); margin: 1.5rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.tally > div { padding: 1rem 1rem 1rem 0; }
.tally > div + div { padding-left: 1rem; border-left: 1px solid var(--line); }
.tally .n { display: block; font-weight: 800; font-size: clamp(1.7rem, 3vw, 2.2rem); line-height: 1.05; color: var(--navy); }
.tally .k { display: block; margin-top: .3rem; font-size: .86rem; color: var(--ink-2); }
@media (max-width: 560px) { .tally > div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); } }

.tracker { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.status { display: flex; flex-direction: column; gap: .6rem; background: #fff; border: 1px solid var(--line); border-top: 4px solid #8A94A6; border-radius: var(--radius); padding: 1.2rem; }
.status--yes { border-top-color: #2E7D4F; }
.status--no { border-top-color: var(--red); }
.status-label { display: flex; align-items: center; gap: .5rem; font-weight: 800; font-size: .8rem; letter-spacing: .13em; text-transform: uppercase; color: var(--navy); }
.dot { width: 10px; height: 10px; border-radius: 50%; background: #8A94A6; flex: none; }
.status--yes .dot { background: #2E7D4F; }
.status--no .dot { background: var(--red); }
.status p { font-size: .93rem; color: var(--ink-2); }
.status .evidence { margin-top: auto; padding-top: .6rem; border-top: 1px dashed var(--line-2); font-size: .86rem; }
.status .evidence strong { display: block; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }

/* ---------- Document packets ---------- */

.packets { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; margin-top: 1.25rem !important; }
.packet { display: flex; flex-direction: column; gap: .55rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.25rem; }
.packet-kind { font-weight: 800; font-size: .74rem; letter-spacing: .13em; text-transform: uppercase; color: var(--gold-700); }
.packet h3 { margin-top: 0 !important; font-family: var(--serif); font-weight: 700; font-size: 1.2rem; color: var(--navy); }
.packet p { font-size: .93rem; color: var(--ink-2); flex: 1; }
.packet .btn { align-self: flex-start; }
.packet .btn[aria-disabled="true"] { background: transparent; color: var(--muted); border-color: var(--line-2); pointer-events: none; }
.packet-pending { font-size: .84rem; font-style: italic; color: var(--muted); }

/* ---------- Letter cards ----------
   .prose spaces only its own direct children, so paragraphs and lists inside a
   letter card sat flush against each other. This gives them the same rhythm. */
.prose .letter-card > p + p,
.prose .letter-card > p + ul,
.prose .letter-card > p + ol,
.prose .letter-card > ul + p,
.prose .letter-card > ol + p,
.prose .letter-card > p + .callout,
.prose .letter-card > ul + .callout,
.prose .letter-card > .callout + p,
.prose .letter-card > .callout + .btn-row,
.prose .letter-card > .btn-row + p,
.prose .letter-card > h2 + p,
.prose .letter-card > ul + .bill-yes { margin-top: .95rem; }

/* The source line under each line item. Small, but always there. */
.issue-source { margin-top: .5rem; font-size: .8rem; line-height: 1.45; color: var(--muted); }
.issue-source a { color: var(--navy-700); }
.issue-source strong { display: block; font-size: .68rem; letter-spacing: .13em; text-transform: uppercase; color: var(--muted); margin-bottom: .15rem; }

/* The one row in the action panel aimed at candidates rather than voters, set
   off so a legislator's staffer spots it without hunting. */
.action-link--candidate { background: var(--sky); border-radius: var(--radius-sm); }
.action-link--candidate:hover { background: var(--sky-2); }

/* ---------- The ask: two asks before Election Day ---------- */

.ask-band { background: var(--navy); color: #fff; padding: clamp(2.25rem, 5vw, 3.25rem) 0; }
.ask-band .eyebrow { color: #F0C064; }
.ask-band h2 { font-family: var(--serif); font-weight: 900; font-size: clamp(1.6rem, 3.2vw, 2.4rem); line-height: 1.12; margin-top: .6rem; color: #fff; }
.ask-band .ask-lede { margin-top: .9rem; font-size: clamp(1.02rem, 1.6vw, 1.15rem); color: #D7E0F0; max-width: 62ch; }

.clock { display: flex; flex-wrap: wrap; align-items: baseline; gap: .55rem 1.4rem; margin-top: 1.5rem; padding: 1rem 0; border-top: 1px solid rgba(255, 255, 255, .22); border-bottom: 1px solid rgba(255, 255, 255, .22); }
.clock-num { font-family: var(--sans); font-weight: 800; font-size: clamp(2rem, 5vw, 3rem); line-height: 1; color: var(--gold); }
.clock-word { font-weight: 700; font-size: .96rem; color: #fff; }
.clock-dates { font-size: .92rem; color: #C6D2E8; }
.clock-dates a { color: #fff; }

.asks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; margin-top: 1.6rem; }
@media (max-width: 760px) { .asks { grid-template-columns: 1fr; } }
.ask { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .2); border-radius: var(--radius); padding: 1.35rem 1.4rem; }
.ask-num { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--gold); color: var(--navy-900); font-weight: 800; font-size: .95rem; }
.ask h3 { margin-top: .7rem; font-family: var(--serif); font-weight: 700; font-size: 1.3rem; color: #fff; }
.ask ul { list-style: none; margin: .8rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.ask li { position: relative; padding-left: 1.1rem; font-size: .95rem; color: #D7E0F0; line-height: 1.45; }
.ask li::before { content: ""; position: absolute; left: 0; top: .55em; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
.ask-band .btn-row { margin-top: 1.6rem; }

/* ---------- The four bills ---------- */

.bills-section { padding: clamp(2.5rem, 5vw, 3.75rem) 0; background: #fff; border-bottom: 1px solid var(--line); }
.section-head { max-width: 64ch; }
.section-head h2 { font-family: var(--serif); font-weight: 900; font-size: clamp(1.55rem, 3vw, 2.15rem); line-height: 1.12; margin-top: .5rem; }
.section-head p { margin-top: .7rem; color: var(--ink-2); font-size: 1.02rem; }
.section-head + .card-grid, .section-head + .builder, .section-head + .board { margin-top: 1.75rem; }

.bill-card { display: flex; flex-direction: column; gap: .6rem; padding: 1.4rem; background: #fff; border: 1px solid var(--line); border-top: 5px solid var(--navy); border-radius: var(--radius); scroll-margin-top: 110px; }
.bill-card--red { border-top-color: var(--red); }
.bill-card--gold { border-top-color: var(--gold); }
.bill-card--purple { border-top-color: var(--purple); }
.bill-kind { font-weight: 800; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.bill-card h3 { font-family: var(--serif); font-weight: 700; font-size: 1.3rem; line-height: 1.18; color: var(--navy); }
.bill-card ul { list-style: none; margin: .25rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .45rem; }
.bill-card li { position: relative; padding-left: 1.05rem; font-size: .94rem; color: var(--ink-2); line-height: 1.45; }
.bill-card li::before { content: ""; position: absolute; left: 0; top: .55em; width: 6px; height: 6px; border-radius: 2px; background: var(--gold); }
.bill-yes { margin-top: auto; padding-top: .8rem; border-top: 1px solid var(--line); font-size: .92rem; color: var(--ink); }
.bill-yes strong { display: block; font-size: .72rem; letter-spacing: .13em; text-transform: uppercase; color: var(--red); margin-bottom: .2rem; }
.bill-links { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }
.bill-links a { display: inline-flex; align-items: center; min-height: 44px; padding: .5rem .9rem; border-radius: var(--radius-sm); border: 1.5px solid var(--navy); color: var(--navy); font-weight: 700; font-size: .88rem; text-decoration: none; }
.bill-links a:hover { background: var(--navy); color: #fff; }

/* ---------- Email builder ---------- */

.email-section { padding: clamp(2.5rem, 5vw, 3.75rem) 0; background: var(--sky-2); border-bottom: 1px solid var(--line); }
.builder { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.4rem, 3vw, 2rem); box-shadow: var(--lift); }
.builder-step + .builder-step { margin-top: 1.6rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.builder-step > h3 { font-family: var(--sans); font-weight: 800; font-size: .8rem; letter-spacing: .13em; text-transform: uppercase; color: var(--navy); }
.builder-step > p { margin-top: .4rem; font-size: .95rem; color: var(--ink-2); }
.builder .field-row { margin-top: 1rem; }
.builder .field-row--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 720px) { .builder .field-row--three { grid-template-columns: 1fr; } }

.chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.chip { position: relative; }
.chip input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.chip span { display: flex; align-items: center; min-height: 44px; padding: .5rem .9rem; border: 1.5px solid var(--line-2); border-radius: 999px; background: var(--sky-2); font-size: .9rem; font-weight: 600; color: var(--ink-2); }
.chip input:checked + span { background: var(--navy); border-color: var(--navy); color: #fff; }
.chip input:focus-visible + span { outline: 3px solid var(--gold); outline-offset: 2px; }

.preview-box { margin-top: 1rem; }
.preview-box label { display: block; font-weight: 700; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--navy); margin-bottom: .35rem; }
.preview-box textarea { width: 100%; min-height: 20rem; padding: 1rem; font: .95rem/1.55 var(--sans); color: var(--ink); background: var(--sky-2); border: 1px solid var(--line-2); border-radius: var(--radius-sm); resize: vertical; }
.preview-box textarea:focus { outline: 3px solid var(--gold); outline-offset: 1px; }
.builder-note { margin-top: .8rem; font-size: .88rem; color: var(--muted); }

/* ---------- Where they stand ---------- */

.stand-section { padding: clamp(2.5rem, 5vw, 3.75rem) 0; background: #fff; border-bottom: 1px solid var(--line); }
.board { margin-top: 1.5rem; }
.board-form { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 1rem; align-items: end; }
@media (max-width: 620px) { .board-form { grid-template-columns: 1fr; } }
.board-count { margin-top: 1rem; font-size: .92rem; color: var(--muted); }
.board-results { margin-top: 1.25rem; display: flex; flex-direction: column; gap: 1rem; }

.race { border: 1px solid var(--line); border-radius: var(--radius); background: #fff; overflow: hidden; scroll-margin-top: 110px; }
.race-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem .9rem; padding: .9rem 1.2rem; background: var(--sky); border-bottom: 1px solid var(--line); }
.race-title { font-family: var(--serif); font-weight: 700; font-size: 1.15rem; color: var(--navy); }
.race-meta { font-size: .86rem; color: var(--muted); }
.race-share { display: inline-flex; align-items: center; min-height: 44px; margin-left: auto; padding: 0 .2rem; font-weight: 700; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--red); text-decoration: none; }
.race-share:hover { text-decoration: underline; }
.cands { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); }
.cand { padding: 1.1rem 1.2rem; }
.cand + .cand { border-left: 1px solid var(--line); }
@media (max-width: 620px) { .cand + .cand { border-left: 0; border-top: 1px solid var(--line); } }
.cand-pick { display: flex; align-items: center; gap: .6rem; min-height: 44px; margin-bottom: .3rem; cursor: pointer; }
.cand-pick input { width: 20px; height: 20px; flex: none; accent-color: var(--navy); }
.cand-pick span { font-weight: 700; font-size: .84rem; letter-spacing: .06em; text-transform: uppercase; color: var(--navy); }
.cand-pick input:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
.cand-name { font-family: var(--serif); font-weight: 700; font-size: 1.1rem; color: var(--navy); }
.cand-meta { margin-top: .15rem; font-size: .84rem; color: var(--muted); }
.cand-items { margin-top: .6rem; font-size: .88rem; color: var(--ink-2); }
.pos-list { list-style: none; margin: .7rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .35rem; }
.pos-list li { display: flex; align-items: baseline; gap: .5rem; font-size: .88rem; color: var(--ink-2); }
.pos-list .pos-bill { flex: 1; }
.pos { display: inline-flex; align-items: center; gap: .3rem; font-weight: 700; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; color: var(--muted); }
.pos-mark { font-weight: 800; }
.pos--support { color: #2E7D4F; }
.pos--oppose { color: var(--red); }
.pos--undecided { color: var(--gold-700); }
.cand-proof { margin-top: .7rem; font-size: .84rem; }
.board-empty { padding: 1.5rem; border: 1px dashed var(--line-2); border-radius: var(--radius); background: var(--sky-2); color: var(--ink-2); font-size: .95rem; }

/* ---------- Candidate pledge form ---------- */

.pledge-form { display: flex; flex-direction: column; gap: 1.5rem; }
.rank-list { list-style: none; margin: 1rem 0 0; padding: 0; border-top: 1px solid var(--line); }
.rank-list li { display: grid; grid-template-columns: 1fr 150px; gap: 1rem; align-items: center; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.rank-list label { font-size: .96rem; color: var(--ink); }
.rank-list select, .field select {
  width: 100%; min-height: 44px; padding: .6rem .7rem; font: 1rem var(--sans); color: var(--ink);
  background: var(--sky-2); border: 1px solid var(--line-2); border-radius: var(--radius-sm);
}
.rank-list select:focus, .field select:focus { outline: 3px solid var(--gold); outline-offset: 1px; }

.pos-group { border: 1px solid var(--line); border-radius: var(--radius); padding: 1.1rem 1.2rem; }
.pos-group + .pos-group { margin-top: .9rem; }
.pos-group legend { font-family: var(--serif); font-weight: 700; font-size: 1.1rem; color: var(--navy); padding: 0 .4rem; }
.pos-group p { font-size: .92rem; color: var(--ink-2); margin-top: .3rem; }
.pos-choices { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .9rem; }
.pos-choice { position: relative; }
.pos-choice input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.pos-choice span { display: flex; align-items: center; min-height: 44px; padding: .5rem 1.1rem; border: 1.5px solid var(--line-2); border-radius: var(--radius-sm); background: #fff; font-weight: 700; font-size: .92rem; color: var(--ink-2); }
.pos-choice input:checked + span { background: var(--navy); border-color: var(--navy); color: #fff; }
.pos-choice input:focus-visible + span { outline: 3px solid var(--gold); outline-offset: 2px; }

/* ---------- Share ---------- */

.share-row { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-top: 1.25rem; }
.share-label { font-weight: 800; font-size: .76rem; letter-spacing: .13em; text-transform: uppercase; color: var(--muted); margin-right: .2rem; }
.share-btn {
  display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; padding: .5rem .95rem;
  border: 1.5px solid var(--line-2); border-radius: 999px; background: #fff;
  font: 700 .88rem var(--sans); color: var(--navy); text-decoration: none; cursor: pointer;
}
.share-btn:hover { border-color: var(--navy); background: var(--navy); color: #fff; }
.share-btn svg { width: 17px; height: 17px; }

.share-sticky { display: none; }
@media (max-width: 760px) {
  .share-sticky {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
    justify-content: center; gap: .6rem; padding: .6rem .9rem calc(.6rem + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .96); border-top: 1px solid var(--line);
  }
  .share-sticky .btn { flex: 1; justify-content: center; }
  body { padding-bottom: 4.5rem; }
}

/* ---------- Print: the pledge form ---------- */

@media print {
  .preview-bar, .site-header, .site-footer, .share-row, .share-sticky, .skip, .page-cta, .toc, .no-print { display: none !important; }
  body { padding-bottom: 0; }
  .article-grid { display: block; }
  .prose { max-width: none; }
  .pos-choice span { border-color: #666; }
}


/* Launch copy: the yellow review notes stay in the files for volunteers,
   but visitors never see them. */
.review-note { display: none !important; }