/* Blahozelania page styles */

body{
  background-color: #a7b96f; /* olive like your mockup */
}

.hidden{ display:none; }

.wish-board{
  position: relative;
  min-height: 520px;
  padding: 10px 0 0;
}

/* speaker */
.sound-btn{
  position: absolute;
  left: 10px;
  top: 60px;
  width: 70px;
  height: 70px;
  border-radius: 999px;
  border: none;
  background: #3f7f8b;
  color: #122c34;
  box-shadow: 3px 3px 10px rgba(0,0,0,.25);
  cursor: pointer;
  font-size: 28px;
  transition: transform .12s ease;
}
.sound-btn:hover{ transform: scale(1.06) rotate(-2deg); }

/* balloons decoration */
.balloons{
  position: absolute;
  left: 20px;
  top: 170px;
  width: 170px;
  height: auto;
  pointer-events: none;
  opacity: 0.95;
}

.wish-title{
  margin: 0;
  text-align: center;
  font-size: 30px;
  font-weight: 700;
}

.wish-subtitle{
  margin: 10px auto 0;
  max-width: 760px;
  text-align: center;
  font-size: 14px;
  line-height: 1.3;
}

/* green rounded banner */
.wish-banner{
  margin: 26px auto 14px;
  max-width: 720px;
  background: #6f805a;
  border: 3px solid #000;
  border-radius: 999px;
  padding: 10px 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: 22px;
  color: #111;
  box-shadow: 3px 3px 10px rgba(0,0,0,.18);
}

.wish-form{
  margin: 0 auto;
  max-width: 720px;
}

.wish-textarea{
  width: 100%;
  min-height: 250px;
  resize: vertical;
  border: 3px solid #000;
  border-radius: 10px;
  padding: 18px;
  font-size: 16px;
  box-sizing: border-box;
  background: #ffffff;
  box-shadow: 3px 3px 10px rgba(0,0,0,.18);
}

.wish-actions{
  margin-top: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.wish-back{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 12px;
  border: 2px solid #000;
  background: rgba(255,255,255,.25);
  color: #000;
  box-shadow: 3px 3px 10px rgba(0,0,0,.12);
  transition: transform .12s ease;
}
.wish-back:hover{ transform: scale(1.03) rotate(-1deg); }

.wish-send{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border-radius: 12px;
  border: 2px solid #000;
  background: linear-gradient(to bottom, #997300, #ffc000);
  color: #000;
  box-shadow: 3px 3px 10px rgba(0,0,0,.18);
  font-size: 18px;
  cursor: pointer;
  transition: transform .12s ease;
}
.wish-send:hover{ transform: scale(1.05) rotate(-1deg); }

.thanks{
  text-align: center;
  padding: 60px 0;
}
.thanks h1{ margin: 0 0 10px; font-size: 36px; }
.thanks p{ margin: 0 0 22px; font-size: 18px; }