/* Mejoremos BuenosAiresYa: ideas de la comunidad para mejorar la plataforma. Usa los tokens de app.css. */
.badge-idea { background: color-mix(in srgb, var(--sun) 22%, transparent); color: var(--heading); }

/* Hoja de ruta: cantidad de ideas por estado */
.idea-roadmap { display: flex; gap: .5rem; overflow-x: auto; padding: .2rem 0 .6rem; margin: .4rem 0 .8rem; scrollbar-width: none; }
.idea-roadmap::-webkit-scrollbar { display: none; }
.idea-stage { flex: 1 0 auto; min-width: 92px; display: flex; flex-direction: column; align-items: center; gap: .1rem; padding: .6rem .7rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--card); color: var(--muted); font-size: .78rem; font-weight: 600; text-align: center; transition: border-color .15s, background .15s; }
.idea-stage strong { font-size: 1.25rem; color: var(--heading); line-height: 1.2; }
.idea-stage:hover { text-decoration: none; border-color: var(--sky); background: var(--blue-50); }
.idea-stage.is-active { border-color: var(--blue); background: var(--blue-50); color: var(--blue); }

/* Estados */
.idea-status.idea-st-new { background: var(--hover); color: var(--muted); }
.idea-status.idea-st-review { background: var(--orange-bg); color: var(--orange); }
.idea-status.idea-st-planned { background: var(--blue-50); color: var(--blue); }
.idea-status.idea-st-in_progress { background: color-mix(in srgb, #5b3fd6 14%, transparent); color: #5b3fd6; }
.idea-status.idea-st-done { background: var(--green-bg); color: var(--green); }
.idea-status.idea-st-declined { background: var(--red-bg); color: var(--red); }
.idea-stage.idea-st-done strong { color: var(--green); }
.idea-stage.idea-st-in_progress strong { color: #5b3fd6; }

/* Tarjetas */
.idea-list { display: flex; flex-direction: column; gap: .8rem; margin-top: .8rem; }
.idea-card, .idea-panel-row { display: flex; gap: 1rem; align-items: flex-start; }
.idea-card { margin: 0; }
.idea-main { flex: 1; min-width: 0; }
.idea-title { font-size: 1.05rem; margin: 0 0 .25rem; overflow-wrap: anywhere; }
.idea-title a { color: var(--heading); }
.idea-excerpt { margin: 0 0 .45rem; color: var(--text); overflow-wrap: anywhere; }
.idea-card .post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.idea-note { margin: .6rem 0 0; padding: .6rem .8rem; border-left: 3px solid var(--blue); background: var(--blue-50); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; font-size: .92rem; color: var(--text); overflow-wrap: anywhere; }

/* Boton "Me sumo" */
.idea-vote form { display: contents; }
.idea-vote-btn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .05rem; width: 74px; min-height: 74px; padding: .45rem .3rem; border: 1.5px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--card); color: var(--muted); font: inherit; cursor: pointer; transition: border-color .15s, background .15s, color .15s, transform .15s; }
.idea-vote-btn:hover { text-decoration: none; border-color: var(--blue); color: var(--blue); }
.idea-vote-btn:active { transform: scale(.94); }
.idea-vote-btn.is-on { border-color: var(--blue); background: var(--blue-50); color: var(--blue); }
.idea-vote-btn.is-closed { cursor: default; border-style: dashed; }
.idea-vote-btn.is-closed:hover { border-color: var(--line-strong); color: var(--muted); }
.idea-vote-num { font-size: 1.15rem; font-weight: 800; color: var(--heading); line-height: 1.1; min-height: 1.1em; }
.idea-vote-btn.is-on .idea-vote-num { color: var(--blue); }
.idea-vote-label { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; white-space: nowrap; }
.idea-vote-btn[aria-busy="true"] { opacity: .6; }

/* Progreso en la pagina de la idea */
.idea-panel .post-meta { display: flex; flex-wrap: wrap; gap: .45rem; margin: 0 0 .7rem; }
.idea-steps { display: flex; flex-wrap: wrap; gap: .3rem; list-style: none; margin: 0; padding: 0; counter-reset: st; }
.idea-steps li { counter-increment: st; padding: .25rem .65rem; border-radius: 999px; background: var(--hover); color: var(--muted); font-size: .76rem; font-weight: 650; }
.idea-steps li::before { content: counter(st) ". "; }
.idea-steps li.is-done { background: var(--blue-50); color: var(--blue); }
.idea-steps li.is-current { background: var(--blue); color: #fff; }

/* Ideas parecidas en el formulario */
.idea-similar { margin-top: .5rem; padding: .7rem .9rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--card-2); font-size: .9rem; }
.idea-similar-head { margin: 0 0 .35rem; font-weight: 650; color: var(--heading); }
.idea-similar ul { margin: 0; padding-left: 1.1rem; }
.idea-similar li { margin: .2rem 0; overflow-wrap: anywhere; }

@media (max-width: 560px) {
  .idea-card, .idea-panel-row { gap: .7rem; }
  .idea-vote-btn { width: 60px; min-height: 64px; }
  .idea-vote-label { font-size: .6rem; }
}
