.missok-vote-wrap{
  margin-top: 16px;
  display: block;
  position: relative;
}

.missok-vote-ui{
  margin-bottom: 10px;
}

.missok-vote-ui-title{
  font-weight: 600;
  margin-bottom: 4px;
}

.missok-vote-ui-text{
  font-size: 14px;
  line-height: 1.4;
}

.missok-vote-row{
  display: flex;
  position: relative;
  align-items: center;
  gap: 10px;
}

.missok-vote-btn{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #ccd0d4;
  background: #f6f7f7;
  color: #1d2327;
  padding: 10px 14px;
  border-radius: 6px;
  cursor: pointer;
  user-select: none;
  transition: opacity .15s ease, filter .15s ease;
}

.missok-vote-btn .dashicons{
  font-size: 18px;
  width: 18px;
  height: 18px;
  line-height: 18px;
}

.missok-vote-btn.is-disabled{
  opacity: 0.55;
  filter: grayscale(1);
  cursor: default;
}

.missok-vote-thanks{
  font-size: 14px;
  color: #1d2327;
}

.missok-vote-tooltip{
  position: absolute;
  left: 0;
  bottom: calc(100% + 6px);
  top: auto;
  background: #1d2327;
  color: #fff;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 13px;
  max-width: 370px;
  z-index: 9999;
  box-shadow: 0 4px 18px rgba(0,0,0,.12);
}

.missok-vote-ended{
  margin-top: 16px;
  padding: 10px 14px;
  border: 1px solid #ccd0d4;
  border-radius: 6px;
  background: #fff;
}

/* When the ended message is rendered inside the widget wrapper, avoid double spacing */
.missok-vote-wrap .missok-vote-ended{
  margin-top: 0;
}
