/* Estilos propios que complementan a Tailwind (CDN). */

/* Contenido de las entradas (HTML heredado de WordPress) */
.contenido { line-height: 1.75; color: #374151; }
.contenido p { margin: 0 0 1rem; }
.contenido h1,.contenido h2,.contenido h3 { color:#4a2170; font-weight:700; margin:1.5rem 0 .75rem; line-height:1.25; }
.contenido h2 { font-size:1.4rem; } .contenido h3 { font-size:1.2rem; }
.contenido a { color:#5f9636; text-decoration:underline; }
.contenido a:hover { color:#4a2170; }
.contenido img { max-width:100%; height:auto; border-radius:.5rem; margin:1rem 0; box-shadow:0 4px 12px rgba(0,0,0,.08); }
.contenido ul,.contenido ol { margin:0 0 1rem 1.25rem; } .contenido ul { list-style:disc; } .contenido ol { list-style:decimal; }
.contenido blockquote { border-left:4px solid #96c93f; background:#f5f0fa; padding:.75rem 1rem; margin:1rem 0; font-style:italic; color:#4a2170; }
.contenido table { width:100%; border-collapse:collapse; margin:1rem 0; }
.contenido table td,.contenido table th { border:1px solid #e5e7eb; padding:.5rem; }
.contenido iframe { max-width:100%; }

/* Recorte de lineas si el CDN no lo trae */
.line-clamp-1{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}

/* Placeholder de marca cuando una nota no tiene imagen (o falla la carga) */
.placeholder { display:block; width:100%; height:100%; position:relative;
  background:linear-gradient(135deg,#f6f2fb,#eae0f4); }
.placeholder::after { content:""; position:absolute; inset:0;
  background:url('/img/logo.png') center / 64px no-repeat; opacity:.28; }

/* ---------- Galería NextGEN convertida ---------- */
.nz-gallery { display:grid; grid-template-columns:repeat(2,1fr); gap:.5rem; margin:1.25rem 0; }
@media (min-width:640px){ .nz-gallery{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:1024px){ .nz-gallery{ grid-template-columns:repeat(4,1fr); } }
.nz-gallery a { display:block; aspect-ratio:1/1; overflow:hidden; border-radius:.5rem; background:#eae0f4; }
.nz-gallery img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.nz-gallery a:hover img { transform:scale(1.06); }
.nz-note { margin:1rem 0; padding:.75rem 1rem; border-radius:.6rem; background:#f6f2fb; color:#5b2a86; font-size:.9rem; border:1px solid #e2d4f0; }

/* ---------- Lightbox ---------- */
.lb-overlay { position:fixed; inset:0; z-index:100; display:none; align-items:center; justify-content:center;
  background:rgba(20,8,32,.92); padding:env(safe-area-inset-top) 0; }
.lb-overlay.open { display:flex; }
.lb-fig { margin:0; max-width:94vw; max-height:88vh; display:flex; flex-direction:column; align-items:center; }
.lb-img { max-width:94vw; max-height:82vh; object-fit:contain; border-radius:.4rem; box-shadow:0 10px 40px rgba(0,0,0,.5); }
.lb-cap { color:#e9ddf5; font-size:.85rem; margin-top:.6rem; text-align:center; max-width:90vw; }
.lb-close { position:absolute; top:12px; right:16px; background:none; border:0; color:#fff; font-size:2.4rem; line-height:1; cursor:pointer; opacity:.85; }
.lb-nav { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.12); border:0; color:#fff;
  width:48px; height:48px; border-radius:9999px; font-size:2rem; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.lb-nav:hover { background:rgba(255,255,255,.25); }
.lb-prev { left:12px; } .lb-next { right:12px; }
.lb-count { position:absolute; bottom:16px; left:50%; transform:translateX(-50%); color:#e9ddf5; font-size:.8rem; background:rgba(0,0,0,.35); padding:.2rem .7rem; border-radius:9999px; }
.contenido img { cursor:zoom-in; }

/* ---------- Tablas responsive: en móvil, cada fila = tarjeta con encabezado ---------- */
@media (max-width: 640px) {
  table.tabla-resp { min-width: 0 !important; }
  table.tabla-resp thead { display: none; }
  table.tabla-resp, table.tabla-resp tbody { display: block; width: 100%; }
  table.tabla-resp tr {
    display: block;
    border: 1px solid #e5e7eb;
    border-radius: .8rem;
    box-shadow: 0 1px 3px rgba(39,16,56,.08);
    margin: 0 .25rem 1rem;
    overflow: hidden;
    background: #fff;
  }
  table.tabla-resp td {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: .55rem .9rem;
    border: none !important;
    border-top: 1px solid #f3f4f6 !important;
    text-align: right;
    white-space: normal !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: break-word;
  }
  table.tabla-resp td::before {
    content: attr(data-label);
    font-weight: 600;
    color: #6b7280;
    text-align: left;
    flex-shrink: 0;
    white-space: nowrap;
  }
  /* Primera celda = encabezado de la tarjeta (título prominente) */
  table.tabla-resp td:first-child {
    background: #f6f2fb;
    color: #48206a;
    font-weight: 700;
    font-size: .95rem;
    justify-content: flex-start;
    text-align: left;
    border-top: none !important;
    padding: .7rem .9rem;
  }
  table.tabla-resp td:first-child::before { display: none; }
  /* URLs y valores largos: que se vean completos */
  table.tabla-resp td[data-label="URL"] { word-break: break-all; }
  table.tabla-resp td[data-label="URL"]::after { content: none; }
  /* Fila de acciones: ocupa todo el ancho, botones a la izquierda */
  table.tabla-resp td.acciones {
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: .6rem;
    background: #fafafa;
  }
  table.tabla-resp td.acciones::before { display: none; }
  table.tabla-resp td:empty { display: none; }
}

/* Ocultar el badge flotante de reCAPTCHA (la atribucion legal queda como texto en el formulario). */
.grecaptcha-badge { visibility: hidden !important; opacity: 0 !important; }