/*
  DWF family-page shape stylesheet -- Senate / House / Congress
  --------------------------------------------------------------
  Every rule below is adapted directly from the reference mockup
  files provided (primarily "Senate Original Three" -- the fullest
  "Final Mockup" reference -- and "Congress Original One" for the
  leadership box, confirmed as the correct pattern). Nothing here
  is pulled from the live plugin.

  Theme-first where possible: no font-family or base text color is
  set except where a component (quotes, chamber box, leadership,
  process steps) is explicitly colored/branded in the source
  mockups themselves, matching what those files actually do.
*/
:root{
  --ink:#171717;
  --muted:#5d5852;
  --rule:#ded8cf;
  --rust:#9C2140;
  --house:#9C2140;
  --senate:#541D34;
  --house-rgb:156,33,64;
  --senate-rgb:84,29,52;
  --house-soft:rgba(var(--house-rgb),.08);
  --senate-soft:rgba(var(--senate-rgb),.08);
  --serif:Georgia,'Times New Roman',serif;
  --soft:#f5f2ec;
}

/* 2026-08-02: scoped here instead of on the bare .dwf-family-page class
   (which is also used when the [congress_member] shortcode is embedded
   in an ordinary theme page/post, where it should fully defer to the
   theme's own content width -- capping it there was the original bug).
   .dwf-plugin-template-content only exists inside this plugin's four
   dedicated full-width templates (family pages, congress member profile,
   state profile, states home), so scoping the cap here reproduces the
   same ~1100px reading width those pages want, without recreating the
   shortcode-context bug this replaced.

   !important is deliberate and narrow here, not habitual: these template
   divs carry alignfull specifically so the page can escape the theme's
   normal (often narrower, sometimes sidebar-having) container -- and
   alignfull is a WordPress block-theme mechanism themes like Kadence
   give their own max-width/width rule specifically so it's NOT easily
   overridden by normal specificity, since punching out of the content
   column is the entire point of the class. Confirmed via a live test
   (new browser, LocalWP restarted -- ruling out any caching explanation)
   that without !important here, the theme's own alignfull rule was
   winning regardless of stylesheet load order, undoing this cap
   entirely. This isn't fighting the theme's normal layout -- it's
   re-narrowing content on a page the plugin itself already asked to go
   full width in the first place. */
.dwf-plugin-template-content{max-width:1100px !important;margin:0 auto !important}
.dwf-family-page a{text-decoration:none}

/* Hero: intro + quote, adapted from .guide-hero / .hero-quote */
.dwf-family-hero{display:grid;grid-template-columns:2fr 1fr;gap:52px;align-items:start;padding-bottom:28px}
.dwf-intro-lead{font-weight:700;margin:0 0 .8em}
.quote{background:#fff;max-width:300px}
.quote-body{display:flex;gap:10px;align-items:flex-start}
.quote-mark{font-family:var(--serif);font-size:76px;line-height:.7;color:#a39784;flex-shrink:0}
.quote-text{flex:1;min-width:0}
.quote-text p{font-family:var(--serif);font-style:normal;font-size:16px;line-height:1.4;color:var(--ink);margin:0}
.quote-text cite{display:block;text-align:right;margin-top:12px;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.dwf-wide-quote .quote{max-width:680px;margin:26px auto 42px}
.dwf-wide-quote .quote-body{gap:16px}
.dwf-wide-quote .quote-mark{font-size:112px}
.dwf-wide-quote .quote-text p{font-size:22px}

/* Stat strip -- no lines around content, centered, relative sizing */
.dwf-stat-strip{display:grid;grid-template-columns:repeat(3,1fr);margin:6px 0 38px;text-align:center}
.dwf-stat-strip>div{padding:0 18px}
.dwf-stat-strip b{display:block;font-weight:900;letter-spacing:.14em;text-transform:uppercase;font-size:.65em;color:var(--rust);margin-bottom:.5em}
.dwf-stat-strip strong{display:block;font-size:1.6em;line-height:1.05;letter-spacing:-.03em}
.dwf-stat-strip span{display:block;font-size:.75em;color:var(--muted);margin-top:.35em}

/* Chamber box: icon + copy + mini-stats + 4 link boxes, from .feature/.mini-stats/.feature-links */
.dwf-chamber-box{color:#fff;border-radius:7px;padding:34px 34px 32px;display:grid;grid-template-columns:110px 1fr;gap:34px;align-items:center}
.dwf-chamber-box.house{background:var(--house)}
.dwf-chamber-box.senate{background:var(--senate)}
.dwf-chamber-box img{width:96px;height:96px;object-fit:contain}
.dwf-chamber-box .label{font-size:.65em;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.65);margin-bottom:.5em}
.dwf-chamber-box h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.7em;line-height:1;letter-spacing:-.02em;color:#fff;margin:0 0 .5em}
.dwf-chamber-box p{font-size:.95em;line-height:1.5;color:rgba(255,255,255,.86);margin:0 0 1.2em}
.dwf-chamber-mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:20px}
.dwf-chamber-mini-stats div{border:1px solid rgba(255,255,255,.20);padding:13px 12px;background:rgba(255,255,255,.06)}
.dwf-chamber-mini-stats strong{display:block;font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.7em;color:#fff;line-height:1}
.dwf-chamber-mini-stats span{display:block;font-size:.55em;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.68);margin-top:5px}
.dwf-chamber-links{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dwf-chamber-links a{display:block;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);padding:12px 14px;font-size:.85em;font-weight:900;line-height:1.2;color:#fff}

/* Process steps (pathway tabs content) -- circular numbered badges with a connecting line */
.dwf-pathway-tabs input{position:absolute;opacity:0;pointer-events:none}
.dwf-pathway-labels{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}
.dwf-pathway-labels label{flex:1;min-width:150px;border:1px solid var(--rule);border-radius:8px;padding:12px 14px;cursor:pointer}
.dwf-pathway-labels label strong{display:block;font-size:13.5px;margin-bottom:3px}
.dwf-pathway-labels label span{display:block;font-size:12px;color:var(--muted);line-height:1.4}
#dwf-path-bill:checked ~ .dwf-pathway-labels label[for="dwf-path-bill"],
#dwf-path-nomination:checked ~ .dwf-pathway-labels label[for="dwf-path-nomination"],
#dwf-path-treaty:checked ~ .dwf-pathway-labels label[for="dwf-path-treaty"],
#dwf-path-impeachment:checked ~ .dwf-pathway-labels label[for="dwf-path-impeachment"],
#dwf-path-oversight:checked ~ .dwf-pathway-labels label[for="dwf-path-oversight"]{border-color:var(--ink);border-width:2px;background:var(--soft, #f5f2ec)}
#dwf-path-bill:checked ~ .dwf-pathway-labels label[for="dwf-path-bill"] strong::before,
#dwf-path-nomination:checked ~ .dwf-pathway-labels label[for="dwf-path-nomination"] strong::before,
#dwf-path-treaty:checked ~ .dwf-pathway-labels label[for="dwf-path-treaty"] strong::before,
#dwf-path-impeachment:checked ~ .dwf-pathway-labels label[for="dwf-path-impeachment"] strong::before,
#dwf-path-oversight:checked ~ .dwf-pathway-labels label[for="dwf-path-oversight"] strong::before{content:'\25B8\0020'}
.dwf-pathway-panel{display:none}
#dwf-path-bill:checked ~ .dwf-pathway-panels .dwf-pathway-panel.bill,
#dwf-path-nomination:checked ~ .dwf-pathway-panels .dwf-pathway-panel.nomination,
#dwf-path-treaty:checked ~ .dwf-pathway-panels .dwf-pathway-panel.treaty,
#dwf-path-impeachment:checked ~ .dwf-pathway-panels .dwf-pathway-panel.impeachment,
#dwf-path-oversight:checked ~ .dwf-pathway-panels .dwf-pathway-panel.oversight{display:block}
.dwf-process-steps{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;position:relative}
.dwf-process-steps::before{content:'';position:absolute;left:8%;right:8%;top:33px;border-top:2px solid var(--rule)}
.dwf-process-steps>div{position:relative;text-align:center;z-index:1}
.dwf-process-steps .num{margin:0 auto 12px;width:62px;height:62px;border-radius:50%;background:#fff;border:3px solid var(--rule);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic;font-size:25px;color:var(--rust)}
.dwf-process-steps h3{font-size:.75em;letter-spacing:.13em;text-transform:uppercase;margin:0 0 .5em}
.dwf-process-steps p{font-family:var(--serif);font-size:.9em;line-height:1.32;color:var(--muted);margin:0}

/* Wide quote uses the same .quote/.quote-body/.quote-mark/.quote-text pattern
   from the hero, sized up via .dwf-wide-quote .quote above -- section
   separator, not a decoration, per the docs. */
.dwf-wide-quote{margin:26px 0 42px;text-align:center}

/* Learn More service tabs -- from .resource-switcher/.resource-nav/.resource-btn/.media-list */
.dwf-service-tabs input{position:absolute;opacity:0;pointer-events:none}
.dwf-service-layout{display:grid;grid-template-columns:minmax(190px,240px) minmax(0,1fr);gap:34px;margin-top:28px}
.dwf-service-nav{display:flex;flex-direction:column;gap:8px;position:sticky;top:24px}
.dwf-service-nav label{border-left:3px solid transparent;cursor:pointer;font-size:14px;font-weight:700;line-height:1.25;padding:10px 12px}
#dwf-service-committees:checked ~ .dwf-service-layout .dwf-service-nav label[for="dwf-service-committees"],
#dwf-service-drafting:checked ~ .dwf-service-layout .dwf-service-nav label[for="dwf-service-drafting"],
#dwf-service-oversight:checked ~ .dwf-service-layout .dwf-service-nav label[for="dwf-service-oversight"],
#dwf-service-confirmations:checked ~ .dwf-service-layout .dwf-service-nav label[for="dwf-service-confirmations"],
#dwf-service-constituent:checked ~ .dwf-service-layout .dwf-service-nav label[for="dwf-service-constituent"],
#dwf-work-votes:checked ~ .dwf-service-layout .dwf-service-nav label[for="dwf-work-votes"],
#dwf-work-sponsored:checked ~ .dwf-service-layout .dwf-service-nav label[for="dwf-work-sponsored"],
#dwf-work-cosponsored:checked ~ .dwf-service-layout .dwf-service-nav label[for="dwf-work-cosponsored"],
#dwf-work-committees:checked ~ .dwf-service-layout .dwf-service-nav label[for="dwf-work-committees"]{border-left-color:currentColor;background:rgba(0,0,0,.04)}
.dwf-service-panel{display:none;border:1px solid rgba(15,23,42,.10);border-radius:16px;padding:30px;box-shadow:0 10px 30px rgba(15,23,42,.04);background:#fff}
#dwf-service-committees:checked ~ .dwf-service-layout .dwf-service-panel.committees,
#dwf-service-drafting:checked ~ .dwf-service-layout .dwf-service-panel.drafting,
#dwf-service-oversight:checked ~ .dwf-service-layout .dwf-service-panel.oversight,
#dwf-service-confirmations:checked ~ .dwf-service-layout .dwf-service-panel.confirmations,
#dwf-service-revenue:checked ~ .dwf-service-layout .dwf-service-panel.revenue,
#dwf-service-constituent:checked ~ .dwf-service-layout .dwf-service-panel.constituent,
#dwf-work-votes:checked ~ .dwf-service-layout .dwf-service-panel.votes,
#dwf-work-sponsored:checked ~ .dwf-service-layout .dwf-service-panel.sponsored,
#dwf-work-cosponsored:checked ~ .dwf-service-layout .dwf-service-panel.cosponsored,
#dwf-work-committees:checked ~ .dwf-service-layout .dwf-service-panel.committees{display:block}
.dwf-service-panel>p{font-size:.95em;line-height:1.55;color:#4b4f54;margin:0 0 22px}
.dwf-media-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 2.4rem}
.dwf-media-item{display:flex;gap:1rem;align-items:flex-start;padding:1.1rem 0;border-bottom:1px solid var(--rule)}
.dwf-media-item:nth-last-child(-n+2){border-bottom:0}
.dwf-media-item img{width:34px;height:34px;flex-shrink:0;object-fit:contain;margin-top:.15rem}
.dwf-media-item:last-child{border-bottom:0}
.dwf-media-item img{width:28px;height:28px;object-fit:contain;flex-shrink:0}
.dwf-media-item h4{font-size:1.05em;line-height:1.1;margin:0 0 .25em}
.dwf-media-item p{font-size:.8em;line-height:1.4;color:var(--muted);margin:0}

/* Comparison table -- from .compare-table (grid-based) */
.dwf-compare-table{display:grid;grid-template-columns:1fr 1.3fr 1.3fr;margin:0 0 2.5rem}
.dwf-compare-table>div{padding:16px 18px;font-size:.95em}
.dwf-compare-table .head{font-weight:900;letter-spacing:.18em;text-transform:uppercase;font-size:.75em;background:#fff}
.dwf-compare-table .house-cell{background:var(--house-soft);color:var(--house);font-weight:900}
.dwf-compare-table .senate-cell{background:var(--senate-soft);color:var(--senate);font-weight:900}

/* Boxless 4-up grid, symmetrical text lengths */
.dwf-plain-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin:0 0 2.5rem}
.dwf-plain-grid h3{margin:0 0 .5em}
.dwf-plain-grid p{margin:0;color:var(--muted);font-size:.92em;line-height:1.45}
.dwf-chamber-pair{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin:0 0 2.5rem}
.dwf-chamber-pair .dwf-chamber-box{grid-template-columns:64px 1fr;gap:18px;padding:28px}
.dwf-chamber-pair .dwf-chamber-box img{width:64px;height:64px}
.dwf-chamber-pair .dwf-chamber-box h2{margin:0 0 .4em;font-size:1.4em}

/* Directory + leadership, paired with matching colored box style */
.dwf-directory-leadership{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:0 0 2.5rem;align-items:stretch}
.dwf-directory-leadership .dwf-boxed-panel{display:flex;flex-direction:column}
.dwf-directory-leadership .dwf-boxed-panel-body{flex:1}
.dwf-boxed-panel{border:1px solid var(--rule);border-radius:10px;overflow:hidden;background:#fff}
.dwf-boxed-panel-head{padding:14px 22px}
.dwf-boxed-panel.house .dwf-boxed-panel-head{background:var(--house)}
.dwf-boxed-panel.senate .dwf-boxed-panel-head{background:var(--senate)}
.dwf-boxed-panel-head h2,.dwf-boxed-panel-head h3{margin:0;font-size:.85em;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#fff}
.dwf-boxed-panel-body{padding:18px 22px}
.dwf-boxed-panel-body>p{margin:0 0 1em;font-size:.9em;color:var(--muted)}
.dwf-state-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:.6rem .4rem}
.dwf-state-grid a{font-size:.9em;font-weight:800;line-height:1.3;color:var(--ink)}
.dwf-leadership-role{display:flex;align-items:flex-start;gap:14px;padding:14px 0;border-bottom:1px solid var(--rule)}
.dwf-leadership-role:last-child{border-bottom:0}
.dwf-leadership-role .num{font-size:1.4em;font-style:italic;color:var(--rust);flex:0 0 24px;line-height:1.2;margin-top:2px;font-family:var(--serif)}
.dwf-leadership-role h4{font-size:.9em;font-weight:800;margin:0 0 .25em;line-height:1.3}
.dwf-leadership-role p{font-size:.82em;color:var(--muted);margin:0;line-height:1.4}

/* Official Links -- media-item style row list, two columns */
.dwf-official-links{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;margin:0 0 2.5rem}
.dwf-official-links a{display:grid;grid-template-columns:190px 1fr 18px;gap:16px;align-items:start;border-top:1px solid var(--rule);padding:13px 0}
.dwf-official-links a h3{font-size:.95em;line-height:1.15;color:var(--rust);font-weight:900;margin:0}
.dwf-official-links a p{font-size:.8em;line-height:1.35;color:var(--muted);margin:0}
.dwf-official-links a span{color:var(--rust);font-weight:900;text-align:right}

@media (max-width:900px){
  .dwf-family-hero,.dwf-service-layout,.dwf-directory-leadership,.dwf-chamber-box{grid-template-columns:1fr}
  .dwf-stat-strip{grid-template-columns:repeat(3,1fr)}
  .dwf-process-steps{grid-template-columns:repeat(3,1fr)}
  .dwf-process-steps::before{display:none}
  .dwf-plain-grid,.dwf-chamber-links,.dwf-chamber-mini-stats,.dwf-official-links,.dwf-media-list{grid-template-columns:1fr}
  .dwf-media-item:nth-last-child(-n+2){border-bottom:1px solid var(--rule)}
  .dwf-media-item:last-child{border-bottom:0}
  .dwf-state-grid{grid-template-columns:repeat(4,1fr)}
  .dwf-compare-table{grid-template-columns:1fr}
  .dwf-flow-chain{flex-direction:column}
  .dwf-flow-arrow{width:100%;height:28px;transform:rotate(90deg)}
  .dwf-leadership-grid{grid-template-columns:1fr}
}

/* Process-flow arrow chain -- from the docs, boxes connected across a real
   sequence, each box in its own correct color per the process-flow
   exception (a real process naturally moving through more than one
   chamber's color is expected, not a violation). Used on the Congress
   overview page for "how a bill becomes law" across both chambers. */
.dwf-flow-chain{display:flex;align-items:stretch;gap:0;flex-wrap:wrap;margin:20px 0 42px}
.dwf-flow-chain .flow-box{flex:1;min-width:160px;border-radius:10px;color:#fff;padding:16px 18px}
.dwf-flow-chain .flow-box span{display:block;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75;margin-bottom:4px}
.dwf-flow-chain .flow-box strong{display:block;font-size:14.5px;line-height:1.3}
.dwf-flow-arrow{display:flex;align-items:center;justify-content:center;width:44px;font-size:20px;color:var(--muted);flex-shrink:0}

/* Leadership list -- two columns, one per chamber, each header colored to
   its chamber. From the docs; used on the Congress overview page in place
   of the directory+leadership pairing the single-chamber pages use. */
.dwf-leadership-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:0 0 2.5rem}
.dwf-leadership-col{border:1px solid var(--rule);border-radius:8px;overflow:hidden}
.dwf-leadership-col h3{margin:0;padding:12px 18px;color:#fff;font-size:13px;letter-spacing:.05em;text-transform:uppercase}
.dwf-leadership-col ol{list-style:none;counter-reset:lead;margin:0;padding:6px 18px 14px}
.dwf-leadership-col li{counter-increment:lead;position:relative;padding:12px 0 12px 26px;border-top:1px solid var(--rule)}
.dwf-leadership-col li:first-child{border-top:0}
.dwf-leadership-col li::before{content:counter(lead);position:absolute;left:0;top:12px;font-family:var(--serif);font-style:italic;color:var(--muted);font-size:15px}
.dwf-leadership-col strong{display:block;font-size:14px;margin-bottom:.2em}
.dwf-leadership-col span{display:block;font-size:.82em;color:var(--muted);line-height:1.4}

/* Rep profile: hero fact row (Party/State/Chamber/Term Ends) */
.dwf-fact-row{display:flex;flex-wrap:wrap;gap:1.6rem 2.2rem;margin:.8rem 0 0}
.dwf-fact-row div{font-size:.85em}
.dwf-fact-row b{display:block;font-weight:900;letter-spacing:.1em;text-transform:uppercase;font-size:.7em;color:var(--rust);margin-bottom:.3em}

/* Rep profile: Congressional Work list entries (votes, bills) -- text
   rows, not icon cards, since each entry is a specific record rather
   than a topic description */
.dwf-work-list{display:grid;gap:0}
.dwf-work-item{display:block;padding:12px 0;border-bottom:1px solid var(--rule)}
.dwf-work-item:last-child{border-bottom:0}
.dwf-work-item a{color:var(--ink);font-weight:700;font-size:.92em;line-height:1.4}
.dwf-work-item .meta{display:block;font-size:.78em;color:var(--muted);margin-top:.25em;font-weight:400}
.dwf-work-pagination{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-size:.85em}
.dwf-work-updated{font-size:.78em;color:var(--muted);margin-top:10px}
