.wss-tester {
  max-width: 800px;
  margin: 1em auto;
}

.wss-tester .input-wrapper{
  display: flex;
  justify-content: center;
  gap: 10px;
  max-width: 400px;
  margin: auto;
}

#wss-url {
  width: calc(100% - 110px);
  padding: .5em;
}

#wss-run {
  padding: .5em 1em;
}

#wss-progress {
    margin: 1em 0;
    display: flex;
    justify-content: center;
    gap: 5px;
}

.wss-spinner {
  display: inline-block;
  width: 24px;
  height: 24px;
  border: 3px solid rgba(0,0,0,.2);
  border-top-color: rgba(0,0,0,.6);
  border-radius: 50%;
  animation: wss-spin 1s linear infinite;
}

@keyframes wss-spin { 
  to { 
    transform: rotate(360deg); 
  } 
}




.wss-results-list {
    list-style: none;
    padding: 0;
    text-align: left;
    display: grid;
    gap: 20px;
    margin-top: 50px;
}

.wss-results-list .item {
    padding: 30px 20px;
    border: 1px solid;
    border-radius: 12px;
}

.wss-header {
    display: flex;
    gap: 5px;
    font-size: 20px;
    font-family: Lexend, sans-serif;
    font-weight: 600;
}

.wss-mark-icon {
  width: 18px;
  height: auto;
  vertical-align: middle;
  margin-right: 4px;
}

img.wss-fail-icon{
  filter: brightness(0) saturate(100%) invert(14%) sepia(73%) saturate(5724%) hue-rotate(4deg) brightness(103%) contrast(127%);
}

img.wss-pass-icon{
  filter: brightness(0) saturate(100%) invert(24%) sepia(79%) saturate(4742%) hue-rotate(120deg) brightness(89%) contrast(107%);;
}

.wss-info p{
  margin: 0;
  font-family: Lexend, sans-serif;
}







ul.wss-sublist{
  margin: 1rem 0;
}

ul.wss-sublist li {
    display: flex;
    margin-bottom: 10px;
    font-family: Lexend, sans-serif;
}

ul.wss-sublist .wss-mark img{
  width: 14px;
}






.wss-pass { 
  color: green; 
}

.wss-fail { 
  color: red; 
}

.wss-error {
  color: #a00;
  font-weight: bold;
}






#wss-summary{
  margin-top: 60px;
}

#wss-summary h2{
  display: flex;
  font-weight: 500;
  gap: 10px;
}

#wss-summary img{
  width: 30px;
  height: auto;
}

.wss-download-wrapper img{
    width: 18px;
    height: auto;
}

.wss-download-wrapper a {
    font-size: 18px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
}





.wss-contact-form{
  margin-top: 60px;
}

.wss-contact-form h3{
  font-weight: 500;
}

.wss-contact-form .wpcf7-form-control-wrap input{
  padding: 16px 4px 16px 4px;
  font-size: 0.9625rem;
  --wpforms-field-size-font-size: 0.9625rem;
  color: #212529;
  --wpforms-field-text-color: #212529;
  background-color: #FFFFFF00;
  --wpforms-field-background-color: #FFFFFF00;
  border-width: 0px 0px 1px 0px;
  --wpforms-field-border-size: 0px 0px 1px 0px;
  border-color: #212529;
  --wpforms-field-border-color: #212529;
  font-family: "Lexend", Poppins;
  line-height: 1.85em;
  margin-bottom: 0.5rem !important;
}

.button-cf7 {
  margin-top: 20px;
}

.button-cf7 input{
  font-family: "Lexend", Poppins;
  line-height: 1.85em;
  border-radius: 60px 60px 60px 60px;
  --wpforms-button-border-radius: 60px 60px 60px 60px;
  padding: 0.45rem 2.2rem 0.45rem 2.2rem;
  font-size: 14px;
  font-weight: 500;
}