/*
Theme Name: Sharon Schneider
Author: Melissa Helen Co.
Author URI: https://melissahelen.com
Text Domain: sharon-schneider
Requires at least: 6.4
Requires PHP: 7.4
Tested up to: 6.4
Version: 1.0

*/

/* Styles intended only for the front.*/
:root {
  --mh-form-margin: 0.9rem; /* Margin */
  --mh-form-padding: 0.6rem; /* Padding */
  --mh-form-select-size: 12px; /* Size of the select arrow */
  --mh-form-control-size: 20px; /* Size of the checkbox and radio button */
  --mh-form-radius: 5px; /* Input border radius */
  --mh-form-svg: var(--wp--preset--color--red-copper); /* Hex color for svgs */
  --mh-form-color: var(
    --wp--preset--color--smoke-black
  ); /* Input and label color */
  --mh-form-placeholder: #999; /* Input placeholder color */
  --mh-form-background: #fff; /* Background color */
  --mh-form-border: var(--wp--preset--color--light-bronze); /* Border color */
  --mh-form-active: var(
    --wp--preset--color--deep-bronze
  ); /* Active highlight color */
  --mh-form-duration: 0.3s; /* Transition duration */
  --mh-form-timing: ease; /* Transition timing */
}

html {
  scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

.wp-block-heading,
.wp-block-group {
  scroll-margin-top: 185px;
}

.has-small-font-size {
  font-weight: 400;
}

.wp-block-outermost-icon-block a:hover {
  transform: unset;
}

input,
textarea {
  appearance: none;
  box-sizing: border-box;
  width: 100%;
  margin: 0 0 var(--mh-form-margin);
  padding: var(--mh-form-padding);
  background: var(--mh-form-background);
  border: 1px solid var(--mh-form-border);
  border-radius: var(--mh-form-radius);
  outline: none;
  resize: vertical;
  transition: border-color var(--mh-form-duration) var(--mh-form-timing);
  color: var(--mh-form-color);
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
}

input[disabled],
textarea[disabled] {
  border-color: lighten(var(--mh-form-border), 5%);
  background-color: darken(var(--mh-form-background), 5%);
  box-shadow: none;
  cursor: not-allowed;
  color: lighten(var(--mh-form-color), 5%);
}

input:focus,
textarea:focus {
  border-color: var(--mh-form-active);
}

input::placeholder,
textarea::placeholder {
  color: var(--mh-form-placeholder);
  opacity: 1;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: var(--mh-form-placeholder);
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
  color: var(--mh-form-placeholder);
}

select {
  appearance: none;
  box-sizing: border-box;
  margin: 0 0 var(--mh-form-margin);
  padding: var(--mh-form-padding);
  padding-right: calc(
    var(--mh-form-padding) + var(--mh-form-padding) / 2 +
      var(--mh-form-select-size)
  );
  width: 100%;
  background: var(--mh-form-background);
  background-image: url("data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http://www.w3.org/2000/svg%22%20xmlns:xlink%3D%22http://www.w3.org/1999/xlink%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22512%22%20height%3D%22512%22%20viewBox%3D%220%200%20512%20512%22%20xml:space%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M256%2C298.3L256%2C298.3L256%2C298.3l174.2-167.2c4.3-4.2%2C11.4-4.1%2C15.8%2C0.2l30.6%2C29.9c4.4%2C4.3%2C4.5%2C11.3%2C0.2%2C15.5L264.1%2C380.9c-2.2%2C2.2-5.2%2C3.2-8.1%2C3c-3%2C0.1-5.9-0.9-8.1-3L35.2%2C176.7c-4.3-4.2-4.2-11.2%2C0.2-15.5L66%2C131.3c4.4-4.3%2C11.5-4.4%2C15.8-0.2L256%2C298.3z%22/%3E%3C/svg%3E");
  background-size: var(--mh-form-select-size);
  background-repeat: no-repeat;
  background-position: calc(100% - var(--mh-form-padding)) center;
  border: 1px solid var(--mh-form-border);
  border-radius: var(--mh-form-radius);
  outline: 0;
  transition: border-color var(--mh-form-duration) var(--mh-form-timing);
  color: var(--mh-form-color);
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
}

select[disabled] {
  border-color: lighten(var(--mh-form-border), 5%);
  background-color: darken(var(--mh-form-background), 5%);
  box-shadow: none;
  cursor: not-allowed;
  color: lighten(var(--mh-form-color), 5%);
}

select:focus {
  border-color: var(--mh-form-active);
}

select::-ms-expand {
  display: none;
}

input[type="radio"],
input[type="checkbox"] {
  appearance: auto;
  margin: 0;
  width: var(--mh-form-control-size);
  height: var(--mh-form-control-size);
}

.wp-element-button,
.wpcf7-submit,
#mc_embed_shell #mc_embed_signup .button {
  transition: background-color 0.3s ease;
}

.wpcf7-submit,
#mc_embed_shell #mc_embed_signup .button {
  background-color: var(--wp--preset--color--light-bronze);
  border: 0;
  border-radius: 9999px;
  box-shadow: none;
  color: var(--wp--preset--color--white);
  font-size: var(--wp--preset--font-size--small);
  line-height: inherit;
  width: fit-content;
  height: auto;
  padding-top: var(--wp--preset--spacing--30);
  padding-right: var(--wp--preset--spacing--60);
  padding-bottom: var(--wp--preset--spacing--30);
  padding-left: var(--wp--preset--spacing--60);
}

.wpcf7-submit:hover,
#mc_embed_shell #mc_embed_signup .button:hover {
  background-color: var(--wp--preset--color--deep-bronze);
}

.nf-field-label .nf-label-span,
.nf-form-content label {
  font-weight: 400;
  font-size: 18px;
  line-height: 20px;
}

.nf-form-content .list-select-wrap .nf-field-element > div,
.nf-form-content input:not([type="button"]),
.nf-form-content textarea {
  font-weight: 400;
  background: #fff;
  border: 1px solid var(--wp--preset--color--light-bronze);
  border-radius: 5px;
  box-shadow: none;
  color: var(--wp--preset--color--smoke-black);
  transition: all 0.5s;
}

.nf-form-content button,
.nf-form-content input[type="button"],
.nf-form-content input[type="submit"] {
  background-color: var(--wp--preset--color--light-bronze);
  border: 0;
  border-radius: 9999px;
  box-shadow: none;
  color: var(--wp--preset--color--white);
  font-size: var(--wp--preset--font-size--small);
  line-height: inherit;
  width: fit-content;
  height: auto;
  padding-top: var(--wp--preset--spacing--30);
  padding-right: var(--wp--preset--spacing--60);
  padding-bottom: var(--wp--preset--spacing--30);
  padding-left: var(--wp--preset--spacing--60);
}

.nf-form-content button,
.nf-form-content input[type="button"],
.nf-form-content input[type="submit"]:hover {
  color: #fff;
  transition: background-color 0.3s ease;
  background-color: var(--wp--preset--color--deep-bronze);
}

.darken-background-image {
  background-blend-mode: multiply;
  background-color: rgba(0, 0, 0, 0.25);
}

.credit-text-right {
  position: absolute;
  bottom: 0;
  right: 0;
  background: #f1f0eb;
  padding: 5px 20px;
  font-size: 0.8em;
  font-weight: bold;
}

.credit-text-left {
  position: absolute;
  bottom: 0;
  left: 0;
  background: #f1f0eb;
  padding: 5px 20px;
  font-size: 0.8em;
  font-weight: bold;
}
