@charset "UTF-8";
/* Tempero Main */
/* Tempero Main */
@keyframes exibefloatheader {
  0% {
    position: fixed;
    top: -200px;
  }
  90% {
    top: 5px;
  }
  100% {
    top: 0px;
  }
}
@keyframes showMenu {
  0% {
    transform: translateY(-50px);
    opacity: 0;
  }
  80% {
    opacity: 0.3;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes showSearch {
  0% {
    transform: translateY(-100px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes HideSearch {
  0% {
    transform: translateY(0);
    opacity: 1;
    display: block;
  }
  100% {
    transform: translateY(100px);
    opacity: 0;
    display: none;
  }
}
@keyframes exibeheadertop {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}
@keyframes zoomIn {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(1.1);
  }
}
@keyframes fadeInExpand {
  from {
    opacity: 0;
    transform: translateY(20px);
    height: 0;
  }
  to {
    opacity: 1;
    transform: translateY(0);
    height: calc(100% - 250px);
  }
}
/* Tempero Main */
@keyframes bounceHeightIn {
  0% {
    height: 50%;
  }
  50% {
    height: 80%;
  }
  70% {
    height: 100%;
    transform: translateY(-15px);
  }
  100% {
    height: 100%;
    transform: translateY(0);
  }
}
@keyframes bounceHeightOut {
  0% {
    height: 100%;
    transform: translateY(0);
  }
  50% {
    height: 100%;
    transform: translateY(15px);
  }
  70% {
    height: 80%;
  }
  100% {
    height: calc(50% - 250px);
  }
}
/* ------------------- */
:root {
  --accent-color: #A1C34C;
  --second-accent-color: #A1C34C;
  --primary-color: #333333;
  --secondary-color: hsl(0, 0%, 40%);
  --tertiary-color: #A1C34C;
  --quaternary-color: #A1C34C;
  --success-color: #A1C34C;
  --warning-color: #FEA01C;
  --alert-color: #cc4b37;
  --neutro-zero: hsl(0, 0%, 100%);
  --neutro-dez: hsl(0, 0%, 10%);
  --neutro-quarto: hsl(0, 0%, 75%);
  --neutro-meio: hsl(0, 0%, 50%);
  --neutro-tresquarto: hsl(0, 0%, 25%);
  --neutro-noventa: hsl(0, 0%, 90%);
  --neutro-cem: hsl(0, 0%, 0%);
  --logourl: url("../imgs/tempero.webp");
  --lighter-grey: #F0F0F0;
  --light-grey: #D9D9D9;
  --medium-grey: #8C8C8C;
  --dark-grey: #313131;
  --accent-alfa-color: rgba(161, 195, 76, 0.5);
  --primary-alfa-color: rgba(51, 51, 51, 0.3);
  --secondary-alfa-color: rgba(102, 102, 102, 0.3);
  --tertiary-alfa-color: rgba(161, 195, 76, 0.3);
  --quaternary-alfa-color: rgba(161, 195, 76, 0.3);
  /* outras variáveis*/
  --border-radius: 15px;
  --border-radius-small: 5px;
  --border-radius-medio: 20px;
  --border-radius-big: 30px;
  --border-radius-img: 35px;
  --border-radius-button: 5px;
  --font-regular: Space Grotesk, sans-serif;
  --font-regular-italic: Space Grotesk, sans-serif;
  --font-light: Space Grotesk, sans-serif;
  --font-light-italic: Space Grotesk, sans-serif;
  --font-semibold: Space Grotesk, sans-serif;
  --font-semibold-italic: Space Grotesk, sans-serif;
  --font-bold: Space Grotesk, sans-serif;
  --font-bold-italic: Space Grotesk, sans-serif;
  --font-extrabold: Space Grotesk, sans-serif;
  --font-extrabold-italic: Space Grotesk, sans-serif;
  --font-weight-light: {$font-weight-light};
  --font-weight-regular: {$font-weight-regular};
  --font-weight-medium: {$font-weight-medium};
  --font-weight-SemiBold: {$font-weight-SemiBold};
  --font-weight-Bold: {$font-weight-Bold};
}

@media (prefers-color-scheme: dark) {
  :root {
    --accent-color: #A1C34C;
    --primary-color: #333333;
    --secondary-color: hsl(0, 0%, 40%);
    --tertiary-color: #A1C34C;
    --quaternary-color: #A1C34C;
    --success-color: #A1C34C;
    --warning-color: #FEA01C;
    --alert-color: #cc4b37;
    --neutro-zero: hsl(0, 0%, 100%);
    --neutro-dez: hsl(0, 0%, 10%);
    --neutro-quarto: hsl(0, 0%, 75%);
    --neutro-meio: hsl(0, 0%, 50%);
    --neutro-tresquarto: hsl(0, 0%, 25%);
    --neutro-noventa: hsl(0, 0%, 90%);
    --neutro-cem: hsl(0, 0%, 0%);
    --logourl: url("../imgs/tempero-propaganda.webp");
    --lighter-grey: #F0F0F0;
    --light-grey: #D9D9D9;
    --medium-grey: #8C8C8C;
    --dark-grey: #313131;
  }
}
html, body {
  color-scheme: light;
  font-family: var(--font-regular);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-semibold);
}

/* CSS-only solution using :has()
 the JS version is commented out lower down */
:root:has(.tw-toggle [value=light]:checked) {
  color-scheme: light;
  --accent-color: #A1C34C;
  --primary-color: #333333;
  --secondary-color: hsl(0, 0%, 40%);
  --tertiary-color: #A1C34C;
  --quaternary-color: #A1C34C;
  --success-color: #A1C34C;
  --warning-color: #FEA01C;
  --alert-color: #cc4b37;
  --neutro-zero: hsl(0, 0%, 100%);
  --neutro-dez: hsl(0, 0%, 10%);
  --neutro-quarto: hsl(0, 0%, 75%);
  --neutro-meio: hsl(0, 0%, 50%);
  --neutro-tresquarto: hsl(0, 0%, 25%);
  --neutro-noventa: hsl(0, 0%, 90%);
  --neutro-cem: hsl(0, 0%, 0%);
  --logourl: url("../imgs/tempero.webp");
  --light-grey: #D9D9D9;
  --medium-grey: #8C8C8C;
  --dark-grey: #313131;
}

:root:has(.tw-toggle [value=dark]:checked) {
  color-scheme: dark;
  --accent-color: #A1C34C;
  --primary-color: #333333;
  --secondary-color: hsl(0, 0%, 40%);
  --tertiary-color: #A1C34C;
  --quaternary-color: #A1C34C;
  --success-color: #A1C34C;
  --warning-color: #FEA01C;
  --alert-color: #cc4b37;
  --neutro-zero: hsl(0, 0%, 100%);
  --neutro-quarto: hsl(0, 0%, 75%);
  --neutro-meio: hsl(0, 0%, 50%);
  --neutro-tresquarto: hsl(0, 0%, 25%);
  --neutro-cem: hsl(0, 0%, 0%);
  --logourl: url("../imgs/tempero-propaganda.webp");
  --light-grey: #D9D9D9;
  --medium-grey: #8C8C8C;
  --dark-grey: #313131;
}

body {
  background-color: var(--neutro-zero) !important;
  color: var(--neutro-tresquarto) !important;
}

/* alignwide AND alignfull: INÍCIO */
/* ------------------- */
#modo-thema {
  position: absolute;
  right: 18px;
  top: 36px;
  z-index: 9999;
  display: none;
}

/*# sourceMappingURL=tempero-main.css.map */