/*SC Fire 2025 B2B 
BASE CSS */

:root {
  --color-red: #981F2F;
  --color-orange: #F57300;
  --gray-light: #E0E0E0;
  --gray-dark: #C9C9C9;
  --white: rgb(255, 255, 255);
  --black: #202020;
  --fontHeader:  "Plus Jakarta Sans", serif;
  --fontBody:  "Plus Jakarta Sans", serif;
}

/*button styles*/
.btn-dark, .ThemeButton {
  font-family: var(--fontBody);
  color: var(--white) !important;
  text-transform: capitalize !important;
  border-radius: 8px;
  border: none;
  width: 245px;
  padding: 24px 40px;
  height: fit-content;
  text-align: center;
}

.btn-dark { background-color: var(--color-red) !important;}
.btn-primary { background-color: var(--color-orange) !important; color: var(--white); }
.btn-secondary { background-color: var(--gray-light) !important; color: var(--black) !important; }
.btn-primary:hover, .btn-dark:hover, .btn-secondary:hover { background-color: var(--black) !important; color: var(--white) !important;}

.btn-outline-dark {
  border: solid 1px var(--black) !important;
  background-color: transparent;
  border-radius: 4px;
  font-weight: 400;
  color: var(--black) !important;
}

.btn-dark:hover {
  background-color: var(--black) !important;
  border-color: var(--black) !important;
  color: var(--white);
}

.btn-outline-dark:hover {
  background: transparent;
  border-color: var(--black) !important;
  color: var(--black) !important;
}

/*Fonts*/
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5 {
  font-family: var(--fontHeader);
  margin-bottom: 0;
  font-weight: 700;
}

body {
  font-family: var(--fontBody);
  font-weight: 400;
  color: var(--black);
  background-color: #fff;
}

body,
html {
  overflow-x: hidden;
}

/*backgrounds*/
.bg-red { background-color: var(--color-red) !important; color: var(--white);}
.bg-red a { color: var(--white); }
.bg-black {
  background-color: var(--black);
  color: var(--white);
}
.bg-lightgray {
  background-color: var(--gray-light);
  color: var(--white);
}

.color-black {
  color: var(--black);
}

/*Inputs*/
:focus { outline: solid 1px #000; }
select, select.form-select, .form-select {
  padding: 8px 10px;
  border:solid 1px var(--gray-dark) !important;
  background-color: var(--gray-light) !important;
  border-radius: 8px; 
}
input::placeholder { color: var(--black) !important; }
input, input.form-control, .form-control { padding: 18px; color: var(--black);  background-color: var(--white); border:solid 1px var(--gray-dark) !important; border-radius: 8px; }

/*Widget Titles*/
.widget-title-sup { color: var(--color-red); text-transform: uppercase;}
.widget-title { position: relative; font-size: 60px;}
.widget-title::after { content: ''; position: absolute; top: 100%; margin-top: 24px; border: solid 1px var(--color-red); height: 4px; width: 78px; border-radius: 100%;  }


/*Mini Products*/
.mini-product { border: solid 1px #000000; }
.mini-product .product-title { font-family: var(--fontHeader); font-weight: 700; line-height: 1; margin-bottom: 0; }
.mini-product .product-price { margin-bottom:16px; }
.mini-product:hover .product-photo {
  scale: 1.1;
  transition: scale 0.3s ease-out;
}
.mini-product .product-photo { transition: scale .3s ease-out; background-color: var(--white);}


/*media queries*/
@media only screen and (min-width:992px) {


}

@media only screen and (min-width: 1200px) {

}

@media only screen and (max-width: 992px) {

}