/* Base Styles */

body {
  font-family: 'Roboto', sans-serif;
  line-height: 5;
  margin: 0;
  padding: 0;
  background-color: #f4f4f4;
}

/* Form Containers */

.form-wrapper,
#rounds-reporter-form,
#registration-form-container {
  max-width: 600px;
  width: 95%;
  margin: 20px auto;
  padding: 20px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  box-sizing: border-box;
}

/* Form Headings */

#rounds-reporter-form h4,
#registration-form-container h4 {
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 15px;
  color: #333;
}

.rounds-success-message {
    color: #ffffff; /* White text */
    background-color: #28a745; /* Green background */
    border-radius: 8px; /* Rounded corners */
    padding: 15px 20px; /* Padding inside the box */
    max-width: 600px; /* Optional: Limit the width */
    margin: 20px auto; /* Center on the page */
    text-align: center; /* Center the text */
    font-size: 16px; /* Adjust font size */
		  font-weight: bold;
     font-family: 'Roboto', sans-serif;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Optional: Add a slight shadow */
}


#rounds-reporter-form label,
#registration-form-container label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: bold;
  color: #555;
}

/* Input Fields */

#rounds-reporter-form input[type="text"],
#rounds-reporter-form input[type="email"],
#rounds-reporter-form input[type="password"],
#rounds-reporter-form select,
#rounds-reporter-form textarea,
#registration-form-container input[type="text"],
#registration-form-container input[type="email"],
#registration-form-container input[type="password"],
#registration-form-container select,
#registration-form-container textarea {
  width: 100%;
  padding: 10px;
  margin-bottom: 15px;
  font-size: 14px;
  color: #00000;
  /* Set text color of dropdown menus to black*/
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  background: #f9f9f9;
}

/* Textareas */

#rounds-reporter-form textarea,
#registration-form-container textarea {
  resize: vertical;
  min-height: 100px;
}

/* Buttons */

button,
#rounds-reporter-form button[type="submit"],
#register-button {
  background-color: #EC1C24;
  /* Red background */
  color: #fff;
  /* White text */
  font-size: 16px;
  /* Font size */
  font-weight: bold;
  padding: 12px;
  border: none;
  border-radius: 5px;
  /* Rounded corners */
  text-align: center;
  min-width: 150px;
  /* Minimum button width */
  cursor: pointer;
  transition: background-color 0.3s ease;
  /* Smooth transition on hover */
}

button:hover,
#rounds-reporter-form button[type="submit"]:hover,
#register-button:hover {
  background-color: #A3171B;
  /* Darker red on hover */
}

/* Flexbox Alignment */

#rounds-reporter-form,
#registration-form-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* Radio Buttons */

.radio-group input[type="radio"] {
  width: 16px;
  height: 16px;
  accent-color: #ec1c24;
}

/* Star Ratings */

.star-rating {
  display: inline-flex;
  gap: 2px;
  /* Adjust the gap between stars */
  cursor: pointer;
  /* Keep the pointer for clarity */
}

.star-rating .star {
  font-size: 24px;
  /* Size of the stars */
  color: #ccc;
  /* Default color for unselected stars */
  transition: color 0.3s ease;
  /* Smooth color transition */
}

.star-rating .star.selected,
.star-rating .star:hover {
  color: gold;
  /* Highlight color for selected/hovered stars */
}

/* Responsive Design */

/* Adjust layout for PC (screens wider than 768px) */
@media (min-width: 769px) {
  .rounds-success-message {
    margin-top: 80px !important; /* Increase margin above the success message */
  }

  #rounds-reporter-form {
    margin-top: -250px; /* Pull the white box higher */
  }
}


@media (max-width: 768px) {
  #rounds-reporter-form {
    margin-top: 50px !important; /* Reduce the gap */
  }

  .rounds-success-message + #rounds-reporter-form {
    margin-top: 20px !important; /* Reduce gap only when the success message is present */
  }
}


@media (min-width: 769px) {
  body.page-id-97 { /* Replace 123 with the actual page ID */
    padding-top: 75px; /* Moves all text down */
  }
}

  #rounds-reporter-form h4,
  #registration-form-container h4 {
    font-size: 16px;
  }

  #rounds-reporter-form label,
  #registration-form-container label {
    font-size: 13px;
  }

  #rounds-reporter-form input[type="text"],
  #rounds-reporter-form input[type="email"],
  #rounds-reporter-form input[type="password"],
  #rounds-reporter-form select,
  #rounds-reporter-form textarea,
  #registration-form-container input[type="text"],
  #registration-form-container input[type="email"],
  #registration-form-container input[type="password"],
  #registration-form-container select,
  #registration-form-container textarea {
    font-size: 13px;
  }

  button,
  #rounds-reporter-form button[type="submit"],
  #register-button {
    font-size: 14px;
    padding: 10px;
  }


/* Miscellaneous Fixes */

h3 {
  display: none;
  /* Remove unnecessary headings */
}

form {
  display: block;
  padding: 0px;
  margin: 0px;
  width: 90%;
  line-height: 20px;
}

.entry-content.wp-block-post-content.is-layout-constrained {
  margin: 0 auto;
  /* Center content */
}

#registration-form-container {
  border-width: 0px;
}

.form-wrapper {
  width: 90%;
  display: flex;
  margin: -100px;
  padding: 0px;
}

.wp-site-blocks {
  width: 90%;
  background-color: #f4f4f4;
}

#rounds-reporter-form {
  margin: 0px;
  margin-top: 200px;
}

.has-text-align-center.has-white-color.has-text-color.has-link-color.has-medium-font-size.wp-elements-05c6eb265e8d4f58e55c51ca9328d5e5 {
  display: none;
}

.wp-block-site-title :where(a) {
  display: none;
}

.entry-content.wp-block-post-content.is-layout-constrained.wp-block-post-content-is-layout-constrained {
  line-height: 30px;
  padding-top: 50px;
}