/*
  TownPost Silverton Theme Refinement

  Final public-facing polish pass. Keeps the system modular and town-scalable:
  it refines the active community theme without changing data, routes, Admin,
  scraping, weather logic, roads logic, or posting behavior.
*/

:root{
  --tp-refine-ink:#142b3f;
  --tp-refine-body:#31465b;
  --tp-refine-soft:#f7f3e7;
  --tp-refine-card:#fffdf7;
  --tp-refine-edge:rgba(177,194,166,.74);
  --tp-refine-gold:rgba(199,149,59,.26);
  --tp-refine-shadow:0 10px 28px rgba(21,50,74,.055);
}

body{
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Header: more publication, less floating app tray. */
.topbar{
  margin-bottom:14px!important;
  border-color:rgba(199,149,59,.18)!important;
}
.brand b,.main-nav button,.account-chip{
  letter-spacing:.01em;
}
.logo{
  box-shadow:inset 0 0 0 1px rgba(255,253,246,.28),0 6px 14px rgba(21,50,74,.10);
}

/* Today masthead: stronger visual rhythm, same layout. */
.hero.tp-hero-with-weather{
  min-height:176px!important;
  padding:18px 24px!important;
}
.hero.tp-hero-with-weather>div{
  align-self:center;
}
.hero.tp-hero-with-weather h1{
  font-size:clamp(44px,5vw,62px)!important;
  line-height:.88!important;
}
.hero.tp-hero-with-weather p:not(.eyebrow){
  color:#31465b!important;
}
.tp-hero-weather{
  align-self:center!important;
}
.tp-hero-weather p{
  color:#22384e!important;
}
.tp-hero-weather a{
  display:inline-flex;
  margin-top:4px;
}

/* Route heroes: Account, Church, Local Help, Hometown, Saved, etc. */
.hero.tp-route-hero-art{
  min-height:126px!important;
  padding:18px 24px!important;
}
.hero.tp-route-hero-art:before{
  width:min(290px,31%)!important;
}
.hero.tp-route-hero-art:after{
  background:linear-gradient(90deg,rgba(255,253,246,.05) 0%,rgba(255,253,246,.26) 23%,rgba(255,253,246,.86) 39%,#fffdf6 100%)!important;
}
.hero.tp-route-hero-art h1{
  font-size:clamp(36px,4.6vw,54px)!important;
  line-height:.9!important;
  letter-spacing:-.052em!important;
}
.hero.tp-route-hero-art p{
  max-width:720px;
  font-size:15px;
  line-height:1.45;
}

/* Content cards: tighter, calmer, more trustworthy. */
.tp-row-card,.panel,.card,.post,.ad,.room-composer.tp-composer,.portal-create-panel,.portal-note{
  border-color:var(--tp-refine-edge)!important;
  box-shadow:var(--tp-refine-shadow)!important;
}
.tp-row-card{
  min-height:205px;
}
.tp-row-card .tp-card-image,
.tp-card-image.real.tp-card-art{
  min-height:170px;
  background-color:#eaf1e6!important;
}
.tp-card h3,.card h3,.post h3,.panel h3,.ad h3{
  color:var(--tp-refine-ink)!important;
}
.tp-card-summary,.post p,.card p,.panel p,.ad p{
  color:var(--tp-refine-body)!important;
}
.tp-card-label,.badge,.tp-card-date{
  font-size:11px!important;
}
.tp-card-details{
  margin-top:8px!important;
}
.tp-card-actions{
  margin-top:10px!important;
}

/* Room composer: cleaner civic form, less huge empty slab. */
.room-composer.tp-composer{
  border-radius:16px!important;
  background:linear-gradient(135deg,#fffdf7,#f9fbf3)!important;
}
.tp-composer-head h3{
  font-size:25px!important;
  color:var(--tp-refine-ink)!important;
}
.tp-composer-box{
  border-radius:14px!important;
  background:#fffef9!important;
}
.tp-composer-input{
  min-height:126px!important;
  font-size:16px!important;
}
.tp-composer-actions button{
  border-radius:13px!important;
}

/* Room mastheads: compact section headers, not secondary giant heroes. */
.tp-room-themed-banner{
  min-height:102px!important;
  border-radius:14px!important;
}
.tp-room-mini-art{
  width:118px!important;
  height:74px!important;
}
.tp-room-themed-banner h2{
  font-size:clamp(28px,3vw,40px)!important;
}
.tp-room-themed-banner p{
  color:#42566b!important;
}

/* Sidebar ad rail: local paper ad feel, secondary to content. */
.sidebar .ad,.sidebar .panel{
  border-radius:14px!important;
}
.sidebar .ad small{
  color:#65758b!important;
}
.sidebar .ad h3{
  font-size:22px!important;
  line-height:1.02!important;
}
.sidebar .ad p,.sidebar .panel p{
  font-size:15px;
}

/* Account/profile: make the left identity card less blocky and the form more official. */
.account-portal{
  gap:20px!important;
}
.portal-goodmorning{
  border:1px solid var(--tp-refine-edge)!important;
  box-shadow:var(--tp-refine-shadow)!important;
}
.portal-community-art{
  min-height:365px!important;
  background-image:url('/assets/heroes/silverton-lower-south-falls-hero.webp')!important;
}
.portal-community-title h2{
  font-size:clamp(42px,5vw,58px)!important;
}
.portal-bottom{
  background:#fffdf7!important;
}
.portal-card h2{
  font-size:clamp(38px,4.2vw,50px)!important;
  letter-spacing:-.045em;
}
.account-summary-grid .portal-note{
  background:#f9fbf4!important;
}
.portal-check{
  padding:12px 4px!important;
}
.portal-check input[type=checkbox]{
  width:20px!important;
  height:20px!important;
}

/* Buttons: consistent click targets without looking cartoonish. */
.actions button,.controls button,.buttonlike,.tp-card-actions button,.tp-card-actions a,.sidebar button{
  border-radius:12px!important;
}
.actions button.primary,.controls button.primary,.tp-composer-actions .primary{
  background:#0f1b2d!important;
  border-color:#0f1b2d!important;
}

@media(max-width:900px){
  .hero.tp-route-hero-art:before{width:38%!important}
  .tp-room-mini-art{width:104px!important;height:68px!important}
}

@media(max-width:640px){
  .hero.tp-hero-with-weather h1{font-size:44px!important}
  .hero.tp-route-hero-art{padding:14px!important}
  .tp-composer-actions{grid-template-columns:1fr!important}
  .portal-community-art{min-height:300px!important}
}