/* =========================================
   Valentine Campaign – Local Styles
   Scoped, safe, reusable
   ========================================= */

:root{
  --v-pink:#e11d48;
  --v-pink-dark:#be123c;
  --v-soft:#fff1f2;
  --v-border:rgba(225,29,72,.18);
  --v-text:#1f2937;
}

/* Soft gradient panel */
.vday-wrap{
  padding:34px 0 50px;
}

.vday-panel{
  position:relative;
  background:
    radial-gradient(800px 300px at 20% 0%, rgba(225,29,72,.18), transparent 60%),
    radial-gradient(800px 300px at 80% 0%, rgba(225,29,72,.12), transparent 60%),
    linear-gradient(180deg, #fff1f2 0%, #ffffff 60%);
  border:1px solid var(--v-border);
  border-radius:20px;
  padding:26px 22px;
  max-width:980px;
  margin:0 auto;
  box-shadow:0 18px 45px rgba(0,0,0,.12);
}

/* Heart SVG decoration */
.vday-heart{
  position:absolute;
  width:46px;
  height:46px;
  opacity:.12;
  fill:var(--v-pink);
}

.vday-heart.top-left{ top:14px; left:16px; }
.vday-heart.bottom-right{ bottom:16px; right:18px; }

/* Typography */
.vday-panel p{
  font-size:1.04rem;
  line-height:1.75;
  color:var(--v-text);
  margin-bottom:14px;
}

.vday-panel h2{
  margin:22px 0 10px;
  font-size:1.35rem;
  position:relative;
  padding-left:12px;
}

.vday-panel h2::before{
  content:"";
  position:absolute;
  left:0;
  top:.25em;
  width:4px;
  height:1.1em;
  border-radius:999px;
  background:linear-gradient(180deg,var(--v-pink),var(--v-pink-dark));
}

.vday-divider{
  border-top:1px solid var(--v-border);
  margin:18px 0;
}

/* Buttons (copied style language from valentinesDay.php) */
.vday-actions{
  margin-top:20px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.vday-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:12px 18px;
  border-radius:999px;
  font-weight:600;
  text-decoration:none;
  transition:all .2s ease;
  border:1px solid transparent;
}

.vday-btn .icon{
  font-size:1.05rem;
  line-height:1;
}

.vday-btn--primary{
  background:linear-gradient(180deg,#e11d48,#be123c);
  color:#fff;
  box-shadow:0 8px 22px rgba(225,29,72,.35);
}

.vday-btn--primary:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 26px rgba(225,29,72,.45);
}

.vday-btn--ghost{
  background:#fff;
  color:#be123c;
  border:1px solid rgba(225,29,72,.35);
}

.vday-btn--ghost:hover{
  background:rgba(225,29,72,.06);
}

/* Mobile */
@media (max-width:768px){
  .vday-panel{ padding:20px 16px; }
}
