/* Echo Ads — matches existing glass/neo-dark vibe */
.echo-ads-wrap{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.echo-ad-card{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;
  background:rgba(255,255,255,.68);
  border:1.5px solid rgba(255,255,255,.9);
  text-decoration:none;color:var(--text);
  backdrop-filter: blur(8px);
}
.echo-ad-card:hover{transform:translateY(-1px);border-color:rgba(255,45,158,.3)}
/* Slightly smaller thumbnails so layouts breathe at 100% browser zoom */
.echo-ad-img{width:56px;height:56px;object-fit:cover;border-radius:12px;flex:0 0 auto}
.echo-ad-title{font-weight:800;letter-spacing:.2px}
.echo-ad-body{opacity:.85;font-size:.95em;line-height:1.25}
.echo-ad-meta{opacity:.65;font-size:.85em;margin-top:4px}
.echo-ad-badge{display:inline-block;font-size:.72em;letter-spacing:.12em;text-transform:uppercase;
  padding:4px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);margin-bottom:8px;
}

.echo-ads-float{position:fixed;top:130px;z-index:60;max-width:min(280px,28vw);pointer-events:none}
.echo-ads-float .echo-ads-wrap{pointer-events:auto}
.echo-ads-left{left:18px}
.echo-ads-right{right:18px}
@media (max-width: 980px){
  .echo-ads-float{display:none}
}

/* Footer container spacing */
.echo-ads-footer{margin:18px 0 8px}


/* Admin form inputs */
.input{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.68);
  border:1.5px solid rgba(255,255,255,.9);
  color:var(--text);
  outline:none;
}
.input:focus{
  border-color:rgba(255,45,158,.5);
  box-shadow:0 0 0 3px rgba(255,45,158,.1);
}


/* Banner slots (top/bottom inside page flow) */
.echo-ads-banner{margin:14px 0}
.echo-ads-banner-top{margin-top:0}
.echo-ads-banner-bottom{margin-bottom:0}

/* Tweet-style feed for /ads page */
.echo-tweet-feed{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 18px;
}
.echo-tweet{
position:relative;
  display:block;
  padding: 16px 16px 12px;
  border-radius: 20px;
  border: 1.5px solid rgba(255,255,255,.9);
  background: rgba(255,255,255,.65);
  box-shadow: 0 18px 60px rgba(0,0,0,.35);
  color: var(--text);
  text-decoration:none;
  backdrop-filter: blur(10px);
  overflow:hidden;
  /* Square, symmetrical post cards for /ads */
  aspect-ratio: 1 / 1;
  display: flex;
  flex-direction: column;
}

.echo-tweet:hover{ border-color: rgba(255,255,255,.18); transform: translateY(-1px); }
.echo-tweet-title{
  font-size: 1.35rem;
  font-weight: 900;
  letter-spacing:.3px;
  line-height: 1.15;
}
.echo-tweet-meta{
  margin-top: 4px;
  opacity:.72;
  font-size:.92rem;
}
.echo-tweet-body{
  margin-top: 10px;
  font-size: 1rem;
  line-height: 1.45;
  opacity:.92;
}
.echo-tweet-media{
margin-top: 12px;
  border-radius: 18px;
  overflow:hidden;
  border:1.5px solid rgba(255,255,255,.9);
  background: rgba(0,0,0,.25);
    /* Media fills the square card without cropping */
  aspect-ratio: 1 / 1;
  flex: 1 1 auto;
  min-height: 0;
  padding: 10px;
}

.echo-tweet-media img{
  width:100%;
  height: 100%;
  object-fit: contain;
  display:block;
}
.echo-tweet-actions{
  display:flex;
  gap:10px;
  align-items:center;
  padding-top: 12px;
  margin-top: 12px;
  border-top: 1px solid rgba(255,255,255,.08);
  opacity:.80;
  font-size:.92rem;
}
.echo-tweet-action{
  padding: 6px 10px;
  border-radius: 999px;
  border: 1.5px solid rgba(255,255,255,.9);
  background: rgba(255,255,255,.04);
}
.echo-tweet-cta{
  margin-left:auto;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.68);
  text-decoration:none;
  color:var(--text);
}
.echo-tweet-cta:hover{ opacity:1; }
.echo-tweet-badge{
  margin-top:10px;
  opacity:.6;
  font-size:.8rem;
}
@media (max-width: 560px){
  .echo-tweet-feed{ grid-template-columns: 1fr; }
  .echo-tweet-media{ border-radius: 16px; }
}


/* Global: remove any social/action buttons in ad renders */
.echo-tweet-actions,
.echo-tweet-action,
.ad-actions,
.ad-action{
  display:none !important;
}


/* Keep text balanced so squares stay symmetrical */
.echo-tweet-title{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.echo-tweet-body{
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}



/* Ads Admin checkbox styling (match Apply page vibe) */
.ads-admin-page .checks{
  margin-top: 6px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.ads-admin-page .check{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.16);
  background: transparent;
  cursor: pointer;
  user-select: none;
}
.ads-admin-page .check input{
  width: 18px;
  height: 18px;
  accent-color: var(--accent);
}
.ads-admin-page .check span{
  color: rgba(255,255,255,.88);
  font-weight: 800;
}
@media (max-width: 900px){
  .ads-admin-page .checks{ grid-template-columns: 1fr; }
}
