/*
  TownPost Community Theme Layer

  Silverton active theme:
  Silver Falls Publication

  Scope:
  - community identity
  - hero art/fade
  - public accent colors
  - public room/card polish
  - publication-style surface treatment

  Out of scope:
  - Admin behavior
  - Today content structure
  - Rooms behavior
  - weather/roads logic
  - source ingestion
*/

:root{
  --tp-community-slug:silverton;
  --tp-community-theme:silver-falls-publication;

  --tp-sf-forest:#315c2f;
  --tp-sf-forest-2:#577a54;
  --tp-sf-water:#2d628c;
  --tp-sf-water-dark:#15324a;
  --tp-sf-cream:#fffdf6;
  --tp-sf-paper:#f7f1e3;
  --tp-sf-mist:#e9f1e7;
  --tp-sf-trail:#c7953b;
  --tp-sf-stone:#6e746e;
  --tp-sf-ink:#1d2f3f;

  --tp-community-hero-image:url('/assets/heroes/silverton-lower-south-falls-hero.webp');
  --tp-community-hero-image-width:46%;
  --tp-community-hero-fade-width:64%;
  --tp-community-hero-content-min:265px;
  --tp-community-hero-weather-width:226px;

  --tp-ink:var(--tp-sf-ink);
  --tp-text:#26364a;
  --tp-muted:#66778d;
  --tp-line:#d9e2d2;
  --tp-paper:var(--tp-sf-cream);
  --tp-cream:var(--tp-sf-cream);
  --tp-green:var(--tp-sf-forest-2);
  --tp-blue:var(--tp-sf-water);
  --tp-gold:var(--tp-sf-trail);
}

body{
  background:
    linear-gradient(90deg,rgba(49,92,47,.045) 0 1px,transparent 1px 100%),
    linear-gradient(180deg,#efe6d3 0%,#fffdf6 34%,#f6f7ef 68%,#eaf3e8 100%);
  background-size:100% 100%,100% 100%;
}

.topbar{
  background:rgba(255,253,246,.96);
  border-color:rgba(199,149,59,.22);
  box-shadow:0 6px 20px rgba(21,50,74,.05);
}
.logo{
  background:linear-gradient(135deg,var(--tp-sf-water-dark),var(--tp-sf-forest),var(--tp-sf-trail));
}
.brand small{color:var(--tp-sf-stone)}
.main-nav button.active,.main-nav button:hover,.account-chip:hover{
  border-color:rgba(49,92,47,.42);
  background:#f4f8ef;
  color:var(--tp-sf-forest);
}

/* Active Today hero: image left, civic text/weather right. */
.hero.tp-hero-with-weather{
  grid-template-columns:minmax(340px,var(--tp-community-hero-image-width)) minmax(var(--tp-community-hero-content-min),1fr) minmax(205px,var(--tp-community-hero-weather-width));
  min-height:182px;
  gap:14px;
  padding:18px 24px;
  background:
    linear-gradient(90deg,rgba(255,253,246,.02) 0%,rgba(255,253,246,.13) 33%,rgba(255,253,246,.88) 56%,rgba(255,253,246,1) 100%),
    linear-gradient(135deg,#dce9d5 0%,#fff3dc 100%);
  border-color:rgba(199,149,59,.22);
  border-radius:16px;
  box-shadow:0 12px 36px rgba(21,50,74,.08);
}
.hero.tp-hero-with-weather:before{
  width:var(--tp-community-hero-image-width);
  min-width:340px;
  background-image:var(--tp-community-hero-image);
  background-position:left center;
  background-size:cover;
  clip-path:none;
  opacity:1;
}
.hero.tp-hero-with-weather:after{
  width:var(--tp-community-hero-fade-width);
  min-width:520px;
  background:linear-gradient(90deg,rgba(255,253,246,0) 0%,rgba(255,253,246,0) 42%,rgba(255,253,246,.34) 58%,rgba(255,253,246,.84) 76%,rgba(255,253,246,1) 94%,rgba(255,253,246,1) 100%);
}
.hero.tp-hero-with-weather>div{
  grid-column:2;
  padding-left:2px;
}
.hero.tp-hero-with-weather .eyebrow{
  color:#517257;
  opacity:.74;
  letter-spacing:.12em;
}
.hero.tp-hero-with-weather h1{
  color:var(--tp-sf-water-dark);
}
.tp-hero-weather{
  grid-column:3;
  padding-left:12px;
}
.tp-hero-weather strong,.tp-hero-weather a{
  color:var(--tp-sf-forest);
}

/* Silverton publication surfaces: less blob, more regional guide. */
.room-banner,.tp-room-banner,.head{
  background:
    linear-gradient(90deg,rgba(49,92,47,.10),rgba(255,253,246,.92) 34%,rgba(255,253,246,1)),
    #fffdf6!important;
  border:1px solid rgba(199,149,59,.22)!important;
  border-left:7px solid var(--tp-sf-forest)!important;
  border-radius:12px!important;
  box-shadow:0 8px 22px rgba(21,50,74,.055)!important;
}
.room-banner h2,.tp-room-banner h2,.head h2,.tp-section-title h3,.tp-community-strip b{
  color:var(--tp-sf-forest);
}
.room-banner p,.tp-room-banner p,.head p{color:#526477}

.panel,.card,.post,.ad,.tp-card,.tp-calendar-card,.tp-roads-card,.tp-community-strip{
  background:rgba(255,253,246,.96)!important;
  border:1px solid rgba(217,226,210,.95)!important;
  border-radius:12px!important;
  box-shadow:0 6px 18px rgba(21,50,74,.045)!important;
}
.sidebar .card,.sidebar .ad,.ad{
  background:#f4eedf!important;
  border-color:rgba(199,149,59,.18)!important;
  box-shadow:none!important;
}

.tp-card{
  overflow:hidden;
}
.tp-card h3{
  color:var(--tp-sf-water-dark);
  letter-spacing:-.01em;
}
.badge,.tp-card-label,.tp-card-date,.tp-text-link,.tp-card-actions a,.buttonlike{
  color:var(--tp-sf-forest)!important;
}
button.primary,.pill.active,.game-tabs .pill.active{
  background:var(--tp-sf-forest)!important;
  border-color:var(--tp-sf-forest)!important;
  color:#fffdf6!important;
}
button,.pill,.tp-card-actions button,.tp-card-actions a,.buttonlike,input,textarea,select{
  border-color:#cfdcca!important;
}
a,.tp-text-link{color:var(--tp-sf-forest)}

/* Realistic card art should carry place identity, not become rounded icon blocks. */
.tp-card-image{
  border-radius:0!important;
}
.tp-card-image.real.tp-card-art{
  background:#eef5eb;
  filter:saturate(.94) contrast(.98) brightness(1.01);
}
.tp-card-image.real.tp-card-art img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.98) contrast(.98) brightness(1.01);
}
.tp-card-art:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(255,253,246,.02),rgba(21,50,74,.08)),
    radial-gradient(circle at 20% 15%,rgba(255,253,246,.20),transparent 30%);
  pointer-events:none;
}
.tp-card-art-map{overflow:hidden;position:relative;background:#eef5eb!important}
.tp-card-art-map img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.95) contrast(.97)}

.tp-card-event .tp-card-label b{background:#dfebd8;color:var(--tp-sf-forest)}
.tp-card-news .tp-card-label b{background:#dbeaf4;color:var(--tp-sf-water)}
.tp-card-history .tp-card-label b{background:#f1e3c5;color:#7b5a27}
.tp-card-veteran .tp-card-label b{background:#e8e3f2;color:#4d4775}
.tp-card-safety .tp-card-label b{background:#f6ddda;color:#9a342d}

/* Forms/composer: civic publication inputs, not default browser boxes. */
input,textarea,select{
  background:#fffdf6!important;
  border-radius:10px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7)!important;
}
textarea:focus,input:focus,select:focus{
  outline:2px solid rgba(45,98,140,.18)!important;
  border-color:rgba(45,98,140,.45)!important;
}

/* Keep Admin visually isolated: public theme does not restyle admin console internals. */
.admin-route-canonical,.admin-route-canonical *{
  --tp-green:initial;
  --tp-blue:initial;
  --tp-gold:initial;
}

@media (max-width:900px){
  :root{
    --tp-community-hero-image-width:44%;
    --tp-community-hero-fade-width:70%;
  }
  .hero.tp-hero-with-weather{
    grid-template-columns:minmax(240px,44%) minmax(220px,1fr);
    min-height:164px;
  }
  .hero.tp-hero-with-weather:before{min-width:260px}
  .hero.tp-hero-with-weather:after{min-width:430px}
  .hero.tp-hero-with-weather>div{grid-column:2}
  .tp-hero-weather{grid-column:2;padding-left:0;align-self:start}
  .tp-hero-weather p,.tp-hero-weather a{font-size:12px}
  .tp-hero-weather strong{font-size:42px}
}
@media (max-width:640px){
  .hero.tp-hero-with-weather{display:block;min-height:210px;padding:20px}
  .hero.tp-hero-with-weather:before{width:100%;min-width:0;height:115px;bottom:auto;background-position:left center}
  .hero.tp-hero-with-weather:after{width:100%;min-width:0;height:170px;bottom:auto;background:linear-gradient(180deg,rgba(255,253,246,0) 0%,rgba(255,253,246,.32) 42%,rgba(255,253,246,.92) 74%,rgba(255,253,246,1) 100%)}
  .hero.tp-hero-with-weather>div{padding-top:98px}
  .hero.tp-hero-with-weather h1{font-size:46px}
  .tp-hero-weather{margin-top:8px;display:flex;align-items:center;gap:12px}
  .tp-hero-weather strong{font-size:36px}
  .tp-hero-weather strong:before{font-size:20px;margin-right:5px;vertical-align:5px}
}
