/*ADS Gear 2024 
BASE CSS */

/*FONTS*/
@font-face {
  font-family: Tactic Sans;
  font-weight: 700;
  src: url('https://icetest.americommerce.com/Shared/Themes/ICETest2024/fonts/tacticsans-bld.otf');
}

@font-face {
  font-family: Protipo Wide;
  font-weight: 500;
  src: url('https://icetest.americommerce.com/Shared/Themes/ICETest2024/fonts/protipowide.otf');
}


:root {
  --color-primary: #ED1D24;
  --gray-light: #EEEEEE;
  --gray-dark: #C9C9C9;
  --white: rgb(255, 255, 255);
  --black: #231F20;
  --fontHeader: Roboto, sans-serif;
  --fontBody: Roboto, sans-serif;
}

/*button styles*/
.btn-dark, .btn, .ThemeButton {
  background: var(--black);
  font-family: var(--fontBody);
  color: var(--white) !important;
  text-transform: uppercase;
  border-radius: 5px;
  border: none;
  width: 245px;
  height: fit-content;
  text-align: center;
  transition: background .25s ease-in-out;
}
a.btn:hover { text-decoration: none !important; }


.btn-dark { background-color: var(--black) !important;}
.btn-primary { background-color: var(--color-primary) !important; color: var(--white); border-color: var(--color-primary) !important;  }
.btn-primary:hover { background-color: var(--black) !important; text-decoration: none !important; border-color: var(--black) !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(--color-primary) !important;
  border-color: var(--color-primary) !important;
  color: var(--white);
}

.btn-outline-dark:hover {
  background: transparent;
  border-color: var(--color-primary) !important;
  color: var(--color-primary) !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-primary { background-color: var(--color-primary) !important; color: var(--white);}
.bg-primary 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*/
label, .signin-email label span, .signin-password label span { font-size: 18px; }
.signin-email label span, .signin-password label span { color: #000; }
:focus { outline: solid 1px #000; }
select, select.form-select, .form-select, .variants-combo-input-enabled {
  padding: 8px 16px;
  font-size: 14px;
  border: solid 1px #c9c9c9;
  background-color: var(--gray-light) !important;
  border-radius: 8px; 
}
input::placeholder { color: var(--black) !important; }
input:not([type="submit"]), input.form-control:not([type="submit"]), .form-control:not([type="submit"]), textarea { border: solid 1px #c9c9c9;  background-color: var(--gray-light) !important; border-radius: 8px; }
textarea { min-height: 110px; }

/*Mini Products*/
.mini-product { border-radius: 8px !important; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2) !important;}
.mini-product .caption { background-color: var(--gray-light); }
.mini-product .product-title a { font-family: var(--fontHeader); font-weight: 700; font-size: 20px; text-transform: uppercase; color: var(--black); line-height: 32px; margin-bottom: 16px; }
.mini-product .product-title a:hover { text-decoration: none; }
.mini-product .product-price { margin-bottom:16px; font-size: 32px; font-weight: 700; line-height: 42px; }
.mini-product .product-reviews { margin-bottom:16px; }
.mini-product .product-photo { overflow: hidden; height: 295px; width: auto; display: flex; justify-content: center; transition: scale .3s ease-out; background-color: var(--white);}
.mini-product .product-photo img { height: 100%; width: auto; }

/*Top Navigation*/
.topNavigation { background: var(--gray-light); padding: 16px; border-radius: 8px; }
.topNavigation select { background-color: #fff !important; min-width: 55px; }

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


}

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

}

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

}