/* Base */
.ahp { font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
.ahp h3, .ahp h4 { margin: .5rem 0 1rem; }

/* Stance buttons */
.ahp-form .ahp-stance {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 1rem;
}
.ahp-btn { border: 0; padding: .6rem .9rem; border-radius: 10px; cursor: pointer; font-weight: 600; }
.ahp-btn-for { background: #1e88e5; color: #fff; }
.ahp-btn-against { background: #e53935; color: #fff; }
.ahp-btn.active { box-shadow: 0 0 0 3px rgba(0,0,0,.08) inset; }

/* Big variant + sub text under button label */
.ahp-stance--big .ahp-btn{
  min-width: 220px;
  padding: 1rem 1.25rem;
  font-size: 1.15rem;
  border-radius: 14px;
  text-align: center;
  line-height: 1.2;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
}
.ahp-btn-sub{
  display: block;
  font-size: .85rem;
  opacity: .9;
  margin-top: .25rem;
}

/* Form */
.ahp-row { display: flex; flex-direction: column; margin-bottom: .6rem; }
.ahp-row.two { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.ahp-row label { font-size: .9rem; color: #444; margin-bottom: .25rem; }
.ahp-row input { padding: .6rem .7rem; border: 1px solid #ddd; border-radius: 8px; }
.ahp-actions { display: flex; align-items: center; gap: .75rem; margin-top: .5rem; }
.ahp-submit { background: #111; color: #fff; border: 0; padding: .65rem 1rem; border-radius: 10px; cursor: pointer; font-weight: 600; }
.ahp-msg { color: #111; font-size: .95rem; }

/* Smooth fade-in when JS visar formuläret */
.ahp-form-fields{ transition: opacity .25s ease; }

/* Stats cards */
.ahp-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; margin-top: 1rem; }
.ahp-card { padding: .8rem; border: 1px solid #eee; border-radius: 12px; text-align: center; background: #fafafa; }
.ahp-num { font-size: 1.5rem; font-weight: 700; }
.ahp-label { font-size: .85rem; color: #666; }

/* Lists */
.ahp-lists { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.ahp-items .ahp-item { display: flex; justify-content: space-between; padding: .5rem .6rem; border-bottom: 1px dashed #eee; }
.ahp-more { margin-top: .6rem; border: 1px solid #ddd; padding: .4rem .7rem; border-radius: 8px; background: #fff; cursor: pointer; }

/* Map */
.ahp-mapwrap { position: relative; }
.ahp-legend { position: absolute; z-index: 2; background: rgba(255,255,255,.9); padding: .4rem .6rem; border-radius: 8px; margin: .5rem; display: flex; gap: .8rem; }
.ahp-legend .for::before { content: ""; display: inline-block; width: 10px; height: 10px; background: #1e88e5; margin-right: .35rem; border-radius: 50%; }
.ahp-legend .against::before { content: ""; display: inline-block; width: 10px; height: 10px; background: #e53935; margin-right: .35rem; border-radius: 50%; }
.ahp-map { width: 100%; height: 420px; border-radius: 12px; overflow: hidden; }

/* Admin layout (för Kampanjer-sidan – fixar overlap) */
.ahp-grid {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) 2fr;
  gap: 16px;
  align-items: flex-start;
}
.ahp-card { background: #fff; border: 1px solid #e5e5e5; border-radius: 8px; padding: 16px; }
.wrap pre { background: #f6f8fa; padding: .6rem .8rem; border-radius: 6px; }

/* Responsivitet */
@media (max-width: 800px){
  .ahp-lists { grid-template-columns: 1fr; }
  .ahp-cards { grid-template-columns: 1fr; }
  .ahp-grid { grid-template-columns: 1fr; }
}