/* LuckScout Petitions — public styles (warm + colorful ✨) */
:root {
  --lsp-pink: #ff4fa3;
  --lsp-orange: #ff8a00;
  --lsp-purple: #7c4dff;
  --lsp-teal: #00c2b2;
  --lsp-yellow: #ffd166;
  --lsp-ink: #1f2330;
  --lsp-muted: rgba(31,35,48,.72);
  --lsp-card: rgba(255,255,255,.92);
  --lsp-border: rgba(31,35,48,.12);
  --lsp-shadow: 0 12px 30px rgba(31,35,48,.12);
}

.lsp-site-main,
.lsp-wrap {
  width: 100%;
}

.lsp-wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 18px 14px 40px;
}

.lsp-card {
  background: var(--lsp-card);
  border: 1px solid var(--lsp-border);
  border-radius: 20px;
  box-shadow: var(--lsp-shadow);
  overflow: hidden;
}

.lsp-toolbar {
  padding: 18px 18px 14px;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  align-items: center;
}

.lsp-title h2 {
  margin: 0;
  font-size: 1.5rem;
  line-height: 1.25;
  color: var(--lsp-ink);
}

.lsp-title p {
  margin: 6px 0 0;
  color: var(--lsp-muted);
}

.lsp-toolbar-right { flex-shrink: 0; }

.lsp-filters { padding: 16px 18px; margin-top: 14px; }
.lsp-hero-card { padding: 18px 18px 16px; }

.lsp-grid { display: grid; gap: 14px; }
.lsp-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lsp-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 780px) {
  .lsp-grid-2, .lsp-grid-3 { grid-template-columns: 1fr; }
}

.lsp-grid-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
@media (max-width: 980px) { .lsp-grid-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .lsp-grid-cards { grid-template-columns: 1fr; } }

.lsp-field span {
  display: inline-block;
  margin-bottom: 6px;
  font-weight: 700;
  color: var(--lsp-ink);
}

.lsp-field span em.lsp-protected {
  font-weight: 400;
  font-style: italic;
}


.lsp-field input[type="text"],
.lsp-field input[type="email"],
.lsp-field input[type="number"],
.lsp-field select,
.lsp-field textarea {
  width: 100%;
  border: 1px solid rgba(31,35,48,.18);
  border-radius: 14px;
  padding: 12px 12px;
  background: rgba(255,255,255,.98);
  color: var(--lsp-ink);
  box-shadow: 0 2px 0 rgba(31,35,48,.03);
  outline: none;
  transition: transform .08s ease, border-color .12s ease, box-shadow .12s ease;
}

.lsp-field textarea { resize: vertical; }

.lsp-field input:focus,
.lsp-field select:focus,
.lsp-field textarea:focus {
  border-color: rgba(124,77,255,.55);
  box-shadow: 0 0 0 4px rgba(124,77,255,.12);
}

.lsp-help {
  display: block;
  margin-top: 6px;
  color: var(--lsp-muted);
  font-size: .9rem;
}

.lsp-muted { color: var(--lsp-muted); }

.lsp-actions {
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.lsp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 999px;
  padding: 10px 16px;
  border: 0 !important;
  cursor: pointer;
  font-weight: 800;
  text-decoration: none !important;
  transition: transform .08s ease, filter .12s ease, box-shadow .12s ease;
  user-select: none;
  line-height: 1;
}

.lsp-btn:hover { transform: translateY(-1px); filter: brightness(1.03); }
.lsp-btn:active { transform: translateY(0px); }

.lsp-btn-primary {
  color: #fff !important;
  background: linear-gradient(135deg, var(--lsp-pink), var(--lsp-orange)) !important;
  box-shadow: 0 10px 20px rgba(255,79,163,.22);
}

.lsp-btn-secondary {
  color: #fff !important;
  background: linear-gradient(135deg, var(--lsp-purple), var(--lsp-teal)) !important;
  box-shadow: 0 10px 20px rgba(124,77,255,.18);
}

.lsp-btn-ghost {
  background: rgba(255,255,255,.8) !important;
  border: 1px solid rgba(31,35,48,.14) !important;
  color: var(--lsp-ink) !important;
}

.lsp-btn-block { width: 100%; }
.lsp-btn-big { padding: 12px 18px; font-size: 1rem; }

.lsp-card-link { color: inherit; text-decoration: none; display: block; }
.lsp-petition-card { overflow: hidden; }
.lsp-card-image { height: 180px; background: radial-gradient(circle at 30% 30%, rgba(255,79,163,.25), rgba(124,77,255,.18)); overflow: hidden; }
.lsp-card-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lsp-placeholder { height: 100%; display: grid; place-items: center; font-size: 3rem; }

.lsp-card-body { padding: 16px 16px 14px; }
.lsp-card-title { margin: 0; font-size: 1.1rem; color: var(--lsp-ink); }
.lsp-card-excerpt { margin: 8px 0 0; color: var(--lsp-muted); font-size: .95rem; }

.lsp-card-cta { margin-top: 14px; }

.lsp-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,209,102,.35);
  color: var(--lsp-ink);
  border: 1px solid rgba(255,209,102,.55);
  font-weight: 800;
  font-size: .95rem;
}

.lsp-pill {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(0,194,178,.12);
  border: 1px solid rgba(0,194,178,.22);
  color: var(--lsp-ink);
  font-weight: 800;
  font-size: .92rem;
}

.lsp-progress { margin-top: 12px; }
.lsp-progress-top,
.lsp-progress-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.lsp-progress-bar {
  height: 12px;
  border-radius: 999px;
  background: rgba(31,35,48,.10);
  overflow: hidden;
  margin-top: 8px;
}

.lsp-progress-bar > span {
  display: block;
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--lsp-orange), var(--lsp-pink), var(--lsp-purple));
  border-radius: 999px;
  box-shadow: 0 10px 22px rgba(124,77,255,.18);
}

.lsp-pagination {
  margin-top: 16px;
  padding: 14px 16px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.lsp-page {
  display: inline-flex;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
  font-weight: 900;
  color: var(--lsp-ink) !important;
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(31,35,48,.14) !important;
}

.lsp-page.current {
  color: #fff !important;
  border: 0 !important;
  background: linear-gradient(135deg, var(--lsp-purple), var(--lsp-teal)) !important;
}

.lsp-empty {
  padding: 18px;
  text-align: center;
}

.lsp-note {
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255,209,102,.25);
  border: 1px solid rgba(255,209,102,.45);
  color: var(--lsp-ink);
  font-weight: 700;
}

.lsp-hp { position:absolute !important; left:-9999px !important; top:-9999px !important; height:1px !important; width:1px !important; opacity:0 !important; }

.lsp-notice {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 10px;
  align-items: start;
  padding: 12px 14px;
  border-radius: 16px;
  margin: 12px auto 0;
  max-width: 1100px;
  box-shadow: 0 10px 20px rgba(31,35,48,.08);
}
.lsp-notice-emoji { font-size: 1.4rem; line-height: 1; }
.lsp-notice-success { background: rgba(0,194,178,.12); border: 1px solid rgba(0,194,178,.22); }
.lsp-notice-error { background: rgba(255,79,163,.10); border: 1px solid rgba(255,79,163,.22); }
.lsp-notice-warning { background: rgba(255,138,0,.12); border: 1px solid rgba(255,138,0,.22); }
.lsp-notice-info { background: rgba(124,77,255,.10); border: 1px solid rgba(124,77,255,.22); }

.lsp-after-content { margin-top: 18px; display: grid; gap: 16px; }

.lsp-sign-card { padding: 16px 18px; }
.lsp-sig-list { padding: 16px 18px; }
.lsp-sigs { list-style: none; padding: 0; margin: 12px 0 0; display: grid; gap: 12px; }
.lsp-sig { display: grid; grid-template-columns: 38px 1fr; gap: 10px; align-items: start; padding: 10px 10px; border-radius: 16px; background: rgba(255,255,255,.6); border: 1px solid rgba(31,35,48,.08); }
.lsp-sig-avatar { width: 38px; height: 38px; border-radius: 14px; display: grid; place-items: center; background: rgba(255,209,102,.30); border: 1px solid rgba(255,209,102,.45); }
.lsp-sig-top { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.lsp-sig-comment { margin-top: 6px; color: var(--lsp-ink); }

.lsp-check { display: flex; gap: 10px; align-items: flex-start; font-weight: 700; color: var(--lsp-ink); }
.lsp-check input { margin-top: 4px; }

/* Single petition */
.lsp-single-hero { padding: 18px 18px 16px; }
.lsp-single-topbar { display:flex; justify-content: space-between; gap: 12px; align-items:center; flex-wrap:wrap; }
.lsp-badges { display:flex; gap:10px; flex-wrap:wrap; margin-top: 12px; }
.lsp-single-title { margin: 12px 0 0; font-size: 2rem; line-height: 1.2; color: var(--lsp-ink); }
.lsp-single-meta { display:flex; gap: 12px; flex-wrap:wrap; align-items:center; margin-top: 12px; }
.lsp-single-cta { display:flex; gap: 12px; flex-wrap:wrap; align-items:center; margin-top: 14px; }
.lsp-single-image { margin-top: 16px; display:flex; justify-content:center; }
.lsp-single-image img { max-width: 760px; width: 100%; height: auto; border-radius: 18px; border: 1px solid rgba(31,35,48,.10); box-shadow: 0 14px 30px rgba(31,35,48,.12); }
.lsp-single-content { margin-top: 16px; color: var(--lsp-ink); }
.lsp-single-content p { color: var(--lsp-ink); }
.lsp-progress-big .lsp-progress-bar { height: 14px; }