/* Front‑end star rating & button styling */

/* Container: center stars and button on the page */
.ssr-stars-container {
  display: block;
  margin: 2em auto;     /* 2em top/bottom, auto left/right centers it */
  text-align: center;    /* center inline children */
}

/* Space below the stars before the button */
.ssr-stars-container .ssr-stars {
  margin-bottom: 1em;
}

/* Individual stars */
.ssr-stars-container .ssr-stars span {
  display: inline-block;
  font-size: 2em;
  color: #ddd;
  margin: 0 0.2em;
  cursor: pointer;
  transition: color 0.2s;
}

/* Only color stars that have .hovered or .selected added by JS */
.ssr-stars-container .ssr-stars span.hovered,
.ssr-stars-container .ssr-stars span.selected {
  color: #f5b301;
}

/* Submit button */
.ssr-stars-container .ssr-submit-btn {
  display: inline-block;
  margin: 0 auto;          /* center if the container is wider */
  padding: 0.75em 1.5em !important;
  font-family: 'Open Sans', sans-serif !important;
  font-weight: 700 !important;
  font-size: 1em;
  text-transform: uppercase !important;
  letter-spacing: 4px !important;
  background-color: #9faee5 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 0 !important;
  opacity: 0.5;             /* disabled look */
  pointer-events: none;
  transition: opacity 0.2s, background-color 0.2s;
}

/* Enabled (clickable) state */
.ssr-stars-container .ssr-submit-btn.enabled {
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Hover on enabled button */
.ssr-stars-container .ssr-submit-btn.enabled:hover {
  background-color: #8ea0d2 !important;
}

/* Thank‑you message styling */
.ssr-stars-container .ssr-thanks {
  margin-top: 0.5em;
  color: #28a745;
  font-family: 'Open Sans', sans-serif;
  font-weight: 600;
}