:root {
  font-size: 16px;
  
  /* Colors */
  --color-white: #FFFFFF;
  --color-white-600: #DBD9D9;
  --color-white-900: #656464;
  
  --color-black: #292525;
  --color-success: #219653;
  --color-error: #D81414;
  
  --color-gray-100: #F6F9FA;
  --color-gray-200: #F0F0F0;
  --color-gray-250: #F6F6F6;
  --color-gray-300: #E9ECED;
  --color-gray-400: #D0D0D0;
  --color-gray-450: #D8D8D8;
  --color-gray-500: #B6B6B6;

  --color-yellow-light: #fffbe6;
  --color-yellow-light-hover: #fff9d9;
  --color-yellow-light-active: #fff2b0;
  
  --color-yellow-normal: #ffd600;
  --color-yellow-normal-hover: #e6c100;
  --color-yellow-normal-active: #ccab00;
  
  --color-yellow-dark: #bfa100;
  --color-yellow-dark-hover: #998000;
  --color-yellow-dark-active: #736000;
  
  --color-yellow-darker: #594b00;
  --color-brown-light: #ABAAA9;


  
  /* Typography */
}

html {
  scroll-behavior: smooth;
  box-sizing: border-box;
}

body {
  min-width: 320px;
  max-width: 1920px;
  margin-inline: auto;
}

img {
  max-width: 100%;
}

a {
  transition: color .3s ease-in-out;
}

@media (max-width: 991.98px) {
  :root {
    font-size: 14px;
  }
}

/* Typography */
h1, .h1 {
  font-size: 2.25rem;
  font-weight: 700;
}

h2, .h2 {
  font-size: 1.5rem;
  font-weight: 700;
}

h3, .h3 {
  font-size: 1.375rem;
  font-weight: 700;
}

h4, .h4 {
  font-size: 1.25rem;
  font-weight: 700;
}

h5, .h5 {
  font-size: 1.25rem;
  font-weight: 700;
}

/* .body-text {
  font-size: 1rem;
  font-weight: 400;
  line-height: 160%;
}

.small-text {
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 130%;
}

.tiny-text {
  font-size: 0.625rem;
  font-weight: 400;
  line-height: 160%;
}

.button-text {
  font-size: 1rem;
  font-weight: 400;
  line-height: 160%;
}

.menu-text {
  font-size: 1rem;
  font-weight: 400;
  line-height: 160%;
}

.h1-big {
  font-size: 6.25rem;
  font-weight: 700;
  line-height: 120%;
}

.body-text-bold {
  font-size: 1rem;
  font-weight: 700;
  line-height: 160%;
}

.h5-bold {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 160%;
} */
/* END Typography */

/* Buttons */
/* .btn-primary {
  font-size: 1rem;
  font-weight: 500;
  line-height: 160%;
  padding: 14px 42px;
  background-color: var(--color-yellow-normal);
  border: 0;
  border-radius: 0;
  color: var(--color-black) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: fit-content;
  cursor: pointer !important;
  text-align: center;
}

.btn-primary:hover, 
.btn-primary:focus, 
.btn-primary:focus-visible {
  background-color: var(--color-yellow-normal-hover);
  color: var(--color-black);
  box-shadow: 0px 3px 16px 0px #00000029;
}

.btn-primary:active {
  background-color: var(--color-yellow-normal) !important;
  color: var(--color-black) !important;
  box-shadow: 0px 0px 10px 0px #00000029 inset;
}

.btn-primary:disabled {
  background-color: var(--color-gray-300);
  color: var(--color-black);
}

.btn-secondary {
  font-size: 1rem;
  font-weight: 500;
  line-height: 160%;
  padding: 14px 42px;
  background-color: unset;
  border: 0;
  border-radius: 0;
  color: var(--color-black) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: fit-content;
  cursor: pointer !important;
  outline: 2px solid var(--color-yellow-normal) !important;
  outline-offset: -2px;
  text-align: center;
}

.btn-secondary:hover, 
.btn-secondary:focus, 
.btn-secondary:focus-visible {
  background-color: var(--color-yellow-normal-hover);
  outline-color: var(--color-yellow-normal-hover) !important;
  color: var(--color-black);
  box-shadow: 0px 3px 16px 0px #00000029;
}

.btn-secondary:active {
  background-color: var(--color-yellow-normal) !important;
  outline-color: var(--color-yellow-normal) !important;
  color: var(--color-black) !important;
  box-shadow: 0px 0px 10px 0px #00000029 inset;
}

.btn-secondary:disabled {
  background-color: var(--color-gray-300);
  outline-color: var(--color-gray-300) !important;
  color: var(--color-black);
}

.btn-onlytext {
  font-size: 1rem;
  font-weight: 500;
  line-height: 160%;
  padding: 6px;
  background-color: unset;
  border: 0;
  border-radius: 0;
  color: var(--color-black);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: fit-content;
  cursor: pointer !important;
  text-align: center;
}

.btn-primary.size-s, 
.btn-secondary.size-s {
  padding: 10px 42px;
}

.btn-primary.size-l, 
.btn-secondary.size-l {
  padding: 18px 52px;
} */

/* END Buttons */

.rox-quantity-and-promo.has-promo{
  display: flex;
  align-items: center;
  /* flex-wrap: wrap; */
  gap: 7px;
  flex-direction: row-reverse;
  width: 100%;
}

.rox-quantity-and-promo.has-promo .quantity-button{
  min-width: 112px;
}

.rox-quantity-and-promo{
  width: 100%;
}

.rox-quantity-and-promo .quantity-button{
  width: 100%;
}

.rox-save{
  width: 100%;
  font-size: .8125rem;
  line-height: 1.4;
  font-weight: 600;
  color: #E3000F;
  background-color: #E4091833;
  padding: .4375rem .75rem;
  border-radius: 1.875rem;
  text-align: center;
  white-space: nowrap;
}

.rox-miniature-product-details{
  display: inline-block;
  font-size: .875rem;
  line-height: 1.4em;
  color: #A2A2A2;
  font-weight: 500;
  width: 100%;
  text-align: center;
  padding: 10px 0;
  transition: color 0.3s;
}

.rox-miniature-product-details:hover{
  color: #000;
}

@media (max-width: 575.98px) {
  .rox-quantity-and-promo.has-promo{
    flex-wrap: wrap;
  }

}

.rx-hotdeals{
  display: none !important;
}