/* ---------- Feed / Alert card ---------- */
.feedcard .fchead{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.fchead .who{font-weight:600;font-size:14px;}
.fchead .meta{color:var(--text-faint);font-size:12.5px;}
.fchead .spacer{flex:1;}
.fcbody{font-size:14.5px;line-height:1.55;color:var(--text);margin-bottom:8px;}
/*
  Antes este aviso no tenía tamaño definido para su ícono, así que el SVG se
  renderizaba a su tamaño intrínseco por defecto (muy grande, ocupando toda
  la publicación). Ahora es una etiqueta pequeña en línea, con ícono
  contenido, al estilo de las etiquetas de "contenido no verificado" de una
  red social.
*/
.fc-usernote{
  display:inline-flex;align-items:center;gap:6px;margin-bottom:10px;padding:4px 10px;
  border-radius:999px;font-size:11.5px;font-weight:600;
  color:var(--risk-suspect);background:rgba(245,158,11,0.1);border:1px solid rgba(245,158,11,0.3);
}
.fc-usernote.is-reported{color:var(--risk-reported);background:rgba(234,179,8,0.1);border-color:rgba(234,179,8,0.3);}
.fc-usernote .ic{width:13px;height:13px;flex:none;}
.fcphone{
  display:inline-flex;align-items:center;gap:8px;margin:2px 0 10px;padding:6px 12px;border-radius:8px;
  background:rgba(244,63,94,0.1);border:1px solid rgba(244,63,94,0.3);
  color:#ffb3c0;font-family:var(--font-head);font-size:13.5px;letter-spacing:0.4px;
}
.fcphone button{
  background:none;border:none;color:var(--text-faint);font-size:11px;cursor:pointer;font-family:var(--font-body);
  text-decoration:underline;padding:0;
}
/*
  Miniatura de una imagen adjunta a la publicación (evidencia). Si en el
  futuro un post trae post.imagen, se muestra contenida dentro de la
  tarjeta -nunca a tamaño completo/desbordado- para mantener el estilo
  compacto de "publicación de red social".
*/
.fcmedia{
  width:100%;max-height:320px;object-fit:cover;border-radius:10px;
  margin:2px 0 10px;display:block;border:1px solid var(--border);
}
.fcactions{display:flex;align-items:center;gap:18px;color:var(--text-dim);font-size:13px;border-top:1px solid var(--border);padding-top:10px;margin-top:6px;}
.fcactions span{cursor:pointer;display:flex;align-items:center;gap:6px;}
.fcactions .ic{width:16px;height:16px;}
.fcactions span:hover{color:var(--accent);}
.fcactions .liked{color:var(--risk-high);}
.fcmenu{margin-left:auto;position:relative;}
.fcmenu-btn{cursor:pointer;color:var(--text-faint);}
.fcmenu-list{
  display:none;position:absolute;right:0;top:24px;background:var(--bg-1);
  border:1px solid var(--border);border-radius:10px;padding:6px;min-width:220px;z-index:10;
  box-shadow:var(--shadow-pop);
}
.fcmenu-list.open{display:block;}
.fcmenu-list div{padding:8px 10px;font-size:13px;color:var(--text-dim);border-radius:6px;cursor:pointer;display:flex;align-items:center;gap:8px;}
.fcmenu-list div:hover{background:var(--glass-strong);color:var(--text);}
.fcmenu-list .ic{width:15px;height:15px;}

/*
  Cada .card tiene backdrop-filter (ver css/components.css), lo que crea un
  contexto de apilamiento propio por tarjeta. Esto hace que el menú "···"
  (position:absolute dentro de la tarjeta) nunca pueda pintarse por encima de
  la tarjeta siguiente del feed, sin importar su z-index interno: quedaba
  tapado por la publicación de abajo. Al abrir un menú, feed.js agrega la
  clase .menu-open a esa tarjeta puntual, que sube su z-index por encima de
  sus vecinas para que el menú se vea completo.
*/
.feedcard{position:relative;}
.feedcard.menu-open{z-index:30;}

/* ---------- Trends ---------- */
.trend-item{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--border);font-size:13.5px;}
.trend-item:last-child{border-bottom:none;}
.trend-item .country{color:var(--text);}
.trend-item .count{color:var(--text-dim);font-size:12px;}

/*
  ---------- News ----------
  Tarjeta horizontal, tipo publicación de Facebook: ícono/imagen fijo a la
  izquierda y todo el contenido de texto a la derecha.
*/
.newscard{display:flex;align-items:flex-start;gap:16px;}
.newscard-icon{
  flex:none;width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--glass-strong);border:1px solid var(--border);
}
.newscard-icon .ic{width:22px;height:22px;}
.newscard-body{flex:1;min-width:0;}
.newscard-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px;}
.newscard h3{font-size:15.5px;margin:0 0 6px;line-height:1.35;}
.newscard p{font-size:13px;color:var(--text-dim);line-height:1.5;margin:0 0 10px;}
.newscard .lvl{font-size:10.5px;padding:3px 9px;border-radius:999px;font-weight:700;font-family:var(--font-head);}
.newscard .newscard-meta{font-size:11.5px;color:var(--text-faint);}
.newscard .foot{display:flex;justify-content:space-between;font-size:11.5px;color:var(--text-faint);gap:8px;flex-wrap:wrap;}
.newscard .newscard-link{color:var(--accent);font-weight:600;text-decoration:none;}
.newscard .newscard-link:hover{text-decoration:underline;}

/* ---------- Buscador ---------- */
.searchpanel{display:flex;gap:10px;margin-bottom:22px;}
.searchpanel input{
  flex:1;background:rgba(0,0,0,0.22);border:1px solid var(--border);border-radius:10px;
  color:var(--text);font-size:15px;padding:14px 16px;outline:none;font-family:var(--font-body);
}
.searchpanel input:focus{border-color:var(--border-strong);}
.resultcard .rchead{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px;gap:12px;}
.resultcard .rctitle{font-family:var(--font-head);font-size:20px;letter-spacing:0.4px;}
.resultcard .rcsub{color:var(--text-dim);font-size:13px;margin-top:4px;}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0;}
.kv .k{font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:3px;}
.kv .v{font-size:14.5px;color:var(--text);}
.methodlist{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 4px;}
.methodlist span{background:rgba(255,255,255,0.04);border:1px solid var(--border);padding:5px 11px;border-radius:999px;font-size:12px;color:var(--text-dim);}

/* ---------- Paises ---------- */
.country-list{display:flex;flex-direction:column;gap:9px;}
.country-row{
  display:flex;align-items:center;gap:14px;padding:13px 16px;border-radius:10px;
  border:1px solid var(--border);cursor:pointer;transition:all .15s;background:none;width:100%;text-align:left;
  font-family:var(--font-body);color:var(--text);
}
.country-row:hover{border-color:var(--border-strong);background:var(--glass-strong);}
.country-row .flag{font-size:19px;}
.country-row .name{flex:1;font-size:14.5px;font-weight:500;}
.country-row .bar-wrap{width:120px;height:6px;background:rgba(255,255,255,0.06);border-radius:6px;overflow:hidden;}
.country-row .bar{height:100%;border-radius:6px;}
.country-row .count{width:46px;text-align:right;font-size:13px;color:var(--text-dim);}
.country-row.active{border-color:var(--border-strong);background:var(--glass-strong);}
.country-row.active .name{color:var(--accent);}

/*
  Estado por defecto del panel derecho antes de elegir un país: en lugar de
  dejar un espacio vacío, muestra un resumen global (top 3 países) para que
  el panel siempre tenga contenido útil y de tamaño similar al de una ficha.
*/
.country-empty{text-align:center;padding:10px 6px 6px;color:var(--text-dim);}
.country-empty-icon{
  width:56px;height:56px;border-radius:50%;background:var(--accent-soft);color:var(--accent);
  display:flex;align-items:center;justify-content:center;margin:0 auto 14px;
}
.country-empty-icon .ic{width:26px;height:26px;}
.country-empty p{font-size:13.5px;margin:0 0 22px;}
.country-empty-top{border-top:1px solid var(--border);padding-top:16px;text-align:left;}
.country-empty-label{display:block;font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:10px;}
.mini-country{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:13.5px;color:var(--text);border-bottom:1px solid var(--border);}
.mini-country:last-child{border-bottom:none;}
.mini-country b{color:var(--text-dim);font-weight:600;}

/* ---------- Alertas ---------- */
.alertcard{position:relative;padding-left:22px;overflow:hidden;transition:transform .15s ease, border-color .15s ease;}
.alertcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--card-accent, var(--risk-none));}
.alertcard:hover{border-color:var(--border-strong);transform:translateY(-1px);}
.alertcard .achead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;}
.alertcard h4{margin:0;font-size:15px;font-weight:600;}
.alertcard .meta{font-size:12px;color:var(--text-faint);margin:2px 0 10px;}
.alertcard p{font-size:13.5px;color:var(--text-dim);margin:0 0 10px;}
.alertcard .stats{display:flex;gap:16px;font-size:12.5px;color:var(--text-dim);flex-wrap:wrap;border-top:1px solid var(--border);padding-top:10px;}
.trending-row{display:flex;align-items:center;gap:14px;padding:12px 4px;border-bottom:1px solid var(--border);border-radius:8px;transition:background .15s ease;}
.trending-row:hover{background:var(--glass-strong);}
.trending-row:last-child{border-bottom:none;}
.trending-row .rank{
  flex:none;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-size:13px;color:var(--text-dim);background:var(--glass);border:1px solid var(--border);
}
.trending-row:nth-child(1) .rank{background:var(--gradient-brand);color:#04120e;border-color:transparent;}
.trending-row .info b{font-size:14.5px;}
.trending-row .info div{font-size:12px;color:var(--text-dim);margin-top:2px;}

/* ---------- Guias ---------- */
.guidecat{cursor:pointer;transition:transform .15s ease, border-color .15s ease;}
.guidecat:hover{border-color:var(--border-strong);transform:translateY(-2px);}
.guidecat .icon-wrap{
  width:42px;height:42px;border-radius:12px;background:var(--accent-soft);
  display:flex;align-items:center;justify-content:center;margin-bottom:10px;color:var(--accent);
}
.guidecat .icon-wrap .ic{width:22px;height:22px;}
.guidecat h3{margin:0 0 4px;font-size:16px;}
.guidecat p{color:var(--text-dim);font-size:12.5px;margin:0;}

/* Página propia de una guía (reemplaza el panel expandible anterior) */
.guidepage{display:none;}
.guidepage.open{display:block;animation:viewfade .25s ease;}
.guideback{
  display:inline-flex;align-items:center;gap:6px;background:none;border:none;padding:0;
  color:var(--text-dim);font-family:var(--font-body);font-size:13.5px;cursor:pointer;margin-bottom:20px;
}
.guideback .ic{width:16px;height:16px;}
.guideback:hover{color:var(--text);}
.guidepage-hero{
  display:flex;gap:20px;align-items:center;margin-bottom:26px;flex-wrap:wrap;
  background:linear-gradient(120deg, rgba(22,200,164,0.14), rgba(109,94,252,0.10));
  border:1px solid var(--border);border-radius:var(--radius-lg);padding:26px;
}
.guidepage-hero .icon-wrap{
  width:54px;height:54px;border-radius:14px;background:var(--accent-soft);color:var(--accent);
  display:flex;align-items:center;justify-content:center;flex:none;
}
.guidepage-hero .icon-wrap .ic{width:26px;height:26px;}
.guidepage-hero h1{font-size:21px;margin-bottom:6px;}
.guidepage-hero p{max-width:560px;}
.guidepage-body{display:flex;flex-direction:column;gap:16px;}
.guidepage-section{background:var(--glass);border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px;}
.guidepage-section h3{font-size:15.5px;margin:0 0 10px;}
.guidepage-section p{font-size:13.5px;color:var(--text-dim);line-height:1.7;margin:0 0 10px;}
.guidepage-section p:last-child{margin-bottom:0;}

/* ---------- Perfil ---------- */
.profile-hero{
  background:linear-gradient(120deg, rgba(22,200,164,0.14), rgba(109,94,252,0.10));
  border:1px solid var(--border);border-radius:var(--radius-lg);padding:26px;
  display:flex;gap:20px;align-items:center;margin-bottom:20px;flex-wrap:wrap;
}
.profile-hero h2{font-size:20px;margin-bottom:4px;}
.profile-hero .handle{color:var(--text-dim);font-size:13.5px;}
.statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px;}
.statgrid .stat{text-align:center;padding:16px;transition:border-color .15s ease, transform .15s ease;}
.statgrid .stat:hover{border-color:var(--border-strong);transform:translateY(-2px);}
.statgrid .num{font-family:var(--font-head);font-size:24px;color:var(--accent);}
.statgrid .lbl{font-size:12px;color:var(--text-dim);margin-top:4px;}
.gate{
  border:1px dashed var(--border-strong);border-radius:var(--radius-lg);padding:52px 24px;
  text-align:center;color:var(--text-dim);max-width:420px;margin:0 auto;
  display:flex;flex-direction:column;align-items:center;
}
.gate-icon{
  width:60px;height:60px;border-radius:50%;background:var(--accent-soft);color:var(--accent);
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;
}
.gate-icon .ic{width:26px;height:26px;}
.gate h3{font-size:16.5px;color:var(--text);margin:0 0 6px;}
.gate p{font-size:13.5px;margin:0 0 20px;max-width:300px;}

/* ---------- Config ---------- */
.togglerow{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--border);gap:16px;}
.togglerow:last-child{border-bottom:none;}
.togglerow .lbl{font-size:14.5px;}
.togglerow .sub{font-size:12px;color:var(--text-faint);margin-top:2px;}

/* ═══════════════════════════════════════════════════════════════════
   SOLICITAR REVISIÓN (vista Reportar)
   Derecho de respuesta de quien aparece mencionado.

   Va plegado por defecto: la vista Reportar es para reportar, y este
   bloque sirve a una persona distinta con una intención opuesta.
   Plegado, no estorba; el encabezado dice lo suficiente para que quien
   lo busca lo reconozca de inmediato.

   El acento morado (--accent-2) lo separa visualmente del verde del
   flujo de reportar: es el otro lado del mostrador.
   ═══════════════════════════════════════════════════════════════════ */

.revision-block{
  margin-top:22px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:linear-gradient(180deg,rgba(109,94,252,0.055),rgba(255,255,255,0.02));
  overflow:hidden;
  transition:border-color .2s ease;
}
.revision-block.open{border-color:rgba(109,94,252,0.34);}

.revision-toggle{
  width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;
  padding:22px 24px;background:none;border:0;cursor:pointer;text-align:left;color:inherit;font:inherit;
}
.revision-toggle:hover{background:rgba(255,255,255,.02);}
.revision-kicker{
  display:inline-block;font-size:11px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--accent-2);margin-bottom:6px;
}
.revision-toggle h2{
  font-family:var(--font-head);font-size:1.15rem;margin:0 0 6px;color:var(--text);
}
.revision-toggle p{margin:0;font-size:.88rem;color:var(--text-dim);line-height:1.6;max-width:62ch;}
.revision-chev{
  color:var(--text-faint);font-size:1.15rem;flex:0 0 auto;margin-top:16px;
  transition:transform .22s ease;
}
.revision-block.open .revision-chev{transform:rotate(180deg);}

.revision-panel{padding:0 24px 26px;border-top:1px solid var(--border);}
.revision-intro{
  margin:22px 0 24px;font-size:.92rem;line-height:1.7;color:var(--text-dim);max-width:78ch;
}

.revision-cols{
  display:grid;grid-template-columns:1.25fr 1fr;gap:28px;margin-bottom:28px;
}
.revision-subtitle{
  font-family:var(--font-head);font-size:.95rem;margin:0 0 12px;color:var(--text);
}

/* Los 5 pasos son el compromiso concreto del procedimiento, así que se
   numeran de forma visible en vez de quedar como una lista más. */
.revision-steps{
  list-style:none;counter-reset:rev;padding:0;margin:0;
}
.revision-steps li{
  counter-increment:rev;position:relative;padding:0 0 16px 38px;
  font-size:.86rem;line-height:1.65;color:var(--text-dim);
}
.revision-steps li::before{
  content:counter(rev);position:absolute;left:0;top:0;
  width:25px;height:25px;border-radius:50%;
  display:grid;place-items:center;
  background:rgba(109,94,252,0.14);border:1px solid rgba(109,94,252,0.32);
  color:#b9b1ff;font-size:12px;font-weight:700;
}
.revision-steps li:not(:last-child)::after{
  content:'';position:absolute;left:12px;top:29px;bottom:6px;width:1px;background:var(--border);
}
.revision-steps strong{color:var(--text);font-weight:600;}

.revision-can{list-style:none;padding:0;margin:0 0 18px;}
.revision-can li{
  position:relative;padding:0 0 11px 20px;font-size:.86rem;line-height:1.6;color:var(--text-dim);
}
.revision-can li::before{
  content:'';position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--accent);
}
.revision-id-note{
  font-size:.8rem;line-height:1.6;color:var(--text-faint);
  padding:13px 15px;border-radius:var(--radius-sm);
  background:rgba(255,255,255,.028);border:1px solid var(--border);margin:0;
}

/* ---- Formulario ---- */
.revision-form{
  padding-top:24px;border-top:1px solid var(--border);
}
.radiogroup-stack{flex-direction:column;gap:7px;align-items:flex-start;}
.radiogroup-stack label{width:100%;}
.field-hint{font-size:11.5px;color:var(--text-faint);margin-top:5px;display:block;}

.uploadbox-label{cursor:pointer;display:flex;align-items:center;gap:9px;}

.revision-notes{
  margin:20px 0;display:grid;gap:12px;
}
.revision-notes p{
  margin:0;font-size:.82rem;line-height:1.65;color:var(--text-dim);
  padding:13px 15px;border-radius:var(--radius-sm);
  background:rgba(255,255,255,.028);border-left:2px solid var(--accent-2);
}
.revision-notes strong{color:var(--text);}

/* ---- Resultado del envío ---- */
.revision-result{
  margin-top:18px;padding:18px 20px;border-radius:var(--radius);
  font-size:.88rem;line-height:1.65;
}
.revision-result h4{font-family:var(--font-head);margin:0 0 10px;font-size:1rem;color:var(--text);}
.revision-result p{margin:0 0 9px;color:var(--text-dim);}
.revision-result-ok{background:var(--accent-soft);border:1px solid rgba(22,200,164,0.3);}
.revision-result-error{
  background:rgba(244,63,94,0.1);border:1px solid rgba(244,63,94,0.3);color:#ffb4c1;
}
.revision-caso{
  font-family:var(--font-head);font-size:1.5rem !important;font-weight:700;
  letter-spacing:.06em;color:var(--accent) !important;margin:4px 0 12px !important;
}
.revision-token summary{cursor:pointer;font-size:.82rem;color:var(--text-dim);}
.revision-token code{
  display:block;margin-top:8px;padding:9px 11px;border-radius:var(--radius-sm);
  background:rgba(0,0,0,.28);font-size:.76rem;word-break:break-all;color:var(--text-dim);
}

/* ---- Seguimiento de caso ---- */
.revision-track{
  margin-top:28px;padding-top:24px;border-top:1px solid var(--border);
}
.revision-track-form{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;}
.revision-track-form input{
  flex:1 1 190px;background:var(--glass);color:var(--text);
  border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:10px 13px;font:inherit;font-size:.88rem;
}
.revision-track-form input:focus{outline:none;border-color:var(--accent);}

.revision-status{
  margin-top:18px;padding:18px 20px;border-radius:var(--radius);
  background:rgba(255,255,255,.028);border:1px solid var(--border);
}
.revision-status-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px;}
.revision-caso-sm{
  font-family:var(--font-head);font-weight:700;letter-spacing:.04em;color:var(--text);
}
.chip-warn{
  background:rgba(245,158,11,0.12);border-color:rgba(245,158,11,0.34);color:#ffd08a;
}
.revision-resolucion{
  margin:14px 0;padding:13px 15px;border-left:3px solid var(--accent);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:var(--accent-soft);font-size:.86rem;
}
.revision-resolucion p{margin:7px 0;color:var(--text-dim);white-space:pre-wrap;line-height:1.6;}

/* Bitácora: solo los eventos públicos del caso. Las notas internas del
   equipo nunca llegan acá — el backend las filtra por `publico`. */
.revtl{list-style:none;padding:0;margin:16px 0 0;}
.revtl li{display:flex;gap:12px;padding:0 0 15px;position:relative;}
.revtl li:not(:last-child)::before{
  content:'';position:absolute;left:5px;top:13px;bottom:0;width:1px;background:var(--border);
}
.revtl-dot{
  width:11px;height:11px;border-radius:50%;flex:0 0 11px;margin-top:3px;background:var(--accent);
}
.revtl-detalle{font-size:.85rem;color:var(--text-dim);line-height:1.6;}
.revtl-fecha{font-size:11.5px;color:var(--text-faint);margin-top:3px;}

.revision-appeal{
  margin-top:20px;padding-top:18px;border-top:1px solid var(--border);
}
.revision-appeal h4{font-family:var(--font-head);margin:0 0 6px;font-size:.95rem;}
.revision-appeal textarea{
  width:100%;margin:12px 0;background:var(--glass);color:var(--text);
  border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:11px 13px;font:inherit;font-size:.88rem;resize:vertical;
}
.revision-appeal textarea:focus{outline:none;border-color:var(--accent);}

@media (max-width:860px){
  .revision-cols{grid-template-columns:1fr;gap:22px;}
  .revision-toggle{padding:18px;}
  .revision-panel{padding:0 18px 22px;}
}