/* Section titles */
.news-wrap{margin-block:1.25rem;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial}
.news-heading{margin:.25rem 0 .25rem;font-size:2rem;text-align:center}
.news-subheading{margin:0 0 1.25rem;text-align:center;color:#6b7280}

/* Grid */
.news-grid{display:grid;gap:1rem}
.news-cols-1{grid-template-columns:1fr}
.news-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.news-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.news-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1024px){.news-cols-3,.news-cols-4{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:640px){.news-cols-2,.news-cols-3,.news-cols-4{grid-template-columns:1fr;}}

/* Card */
.news-card{background:#111;border-radius:.5rem;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.08);}
.news-card__media{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:0;
  isolation:isolate;
  background:#f9fafb;
  height: var(--pdfH, 220px); /* <- controlado por shortcode */
  overflow:hidden;
}
.news-card__media img{
  width:100%;
  height: var(--pdfH, 220px); /* <- mismo alto que el contenedor */
  object-fit:cover;
  display:block;
  filter:brightness(.92)
}

/* PDF canvas: el alto lo fija el JS; no lo fijes aquí */
.news-card__canvas{
  display:block;
  margin:auto;
  width:100%;
  background:#f3f4f6;
  border:1px solid #e5e7eb;
  border-radius:4px;
}

.news-card__overlay{
  position:absolute;left:0;right:0;bottom:0;padding:.75rem 1rem;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%, rgba(0,0,0,.65) 65%, rgba(0,0,0,.85) 100%);
  pointer-events:none;
}
.news-card__title{margin:0;color:#fff;font-size:1.05rem;font-weight:600;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.news-card__meta{padding:.5rem 1rem .9rem;background:#fff}
.news-card__meta time{color:#6b7280;font-size:.9rem}

/* Button */
.news-more{margin-top:1rem;text-align:center}
.news-btn{display:inline-block;padding:.6rem 1rem;border-radius:.5rem;background:#1e40af;color:#fff;text-decoration:none}
.news-btn:hover{background:#193488}

/* Empty + Form */
.news-empty{color:#6b7280;text-align:center}
.news-msg{margin-top:.35rem;font-size:.95rem}
.news-form{display:grid;gap:.75rem;max-width:560px;margin:0 auto}
.news-form input[type="text"],.news-form textarea,.news-form input[type="file"]{width:100%}
.news-form textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;border:1px solid #e5e7eb;border-radius:6px;padding:.5rem}
/* --- Editor con preview --- */
.news-editor{background:#fff;border:1px solid #e5e7eb;border-radius:8px}
.news-tabs{display:flex;gap:.25rem;padding:.25rem;background:#f3f4f6;border-bottom:1px solid #e5e7eb}
.news-tab{appearance:none;border:0;background:transparent;padding:.5rem .75rem;border-radius:6px;cursor:pointer;color:#374151}
.news-tab.is-active{background:#fff;color:#111;box-shadow:0 1px 0 rgba(0,0,0,0.03)}
.news-panels{padding:.75rem}
.news-panel{display:none}
.news-panel.is-active{display:block}
#newsContent{width:100%;min-height:280px;border:1px solid #e5e7eb;border-radius:6px;padding:.6rem;font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace}
.news-preview{display:block;width:100%;min-height:320px;border:1px solid #e5e7eb;border-radius:6px;background:#fff}
.news-hint{margin:.4rem 0 0;color:#6b7280;font-size:.9rem}
/* ===== LISTA VERTICAL ===== */
.news-list{
  display:grid;
  gap:.75rem;
  padding:0;
  margin:0;
  list-style:none;
}
.news-row{
  display:grid;
  grid-template-columns: 200px 1fr;
  gap:1rem;
  align-items:center;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:.5rem;
  padding:.75rem;
}
.news-row__media{
  display:block;
  width:100%;
  height:var(--h,120px);
  overflow:hidden;
  border-radius:.5rem;
  background:#f9fafb;
}
.news-row__media img{
  width:100%;
  height:var(--h,120px);
  object-fit:cover;
  display:block;
  filter:brightness(.96);
}
/* Reutilizamos el mismo canvas pero sin height fijo en CSS (lo pone el JS) */
.news-row .news-card__canvas{ width:100%; background:#f3f4f6; border:1px solid #e5e7eb; border-radius:.35rem; }

.news-row__body{ min-width:0; }
.news-row__title{ margin:.1rem 0 .25rem; font-size:1.1rem; font-weight:600; }
.news-row__title a{ color:#111; text-decoration:none; }
.news-row__title a:hover{ text-decoration:underline; }
.news-row__date{ color:#6b7280; font-size:.92rem; }

@media (max-width:700px){
  .news-row{ grid-template-columns: 1fr; }
  .news-row__media{ height:var(--h,160px); }
  .news-row__media img{ height:var(--h,160px); }
}