/* Custom CSS theme */
@charset "UTF-8";
/* ==========================================================================
   PRO HOCKEY EUROPE — ECWID STORE DESIGN
   Paste into Ecwid ▸ Settings ▸ Design ▸ Custom CSS  (replaces what is there)

   WHY THE STYLING KEPT DISAPPEARING
   ---------------------------------
   The old rules were written as

       html#ecwid_html body#ecwid_body .ec-size .ec-store …

   That prefix only matches inside Ecwid's own hosted store page, where the
   html element really carries id="ecwid_html". On an embedded store — yours,
   inside WordPress — there is no such id, so every one of those rules failed
   to match and the store fell back to Ecwid's own design a moment after the
   app finished rendering. The product title and the price were styled by
   exactly those rules, which is why they came back white.

   Everything below uses .ec-store doubled up for specificity plus !important,
   so it wins no matter when Ecwid injects its own stylesheet, and no colour
   depends on a CSS variable that could fail to resolve.
   ========================================================================== */
/* ==========================================================================
   1 · TYPE
   ========================================================================== */
.ecwid div, .ecwid span, .ecwid a, .ecwid p,
.ec-store.ec-store div, .ec-store.ec-store span,
.ec-store.ec-store a, .ec-store.ec-store p {
  font-family: "Montserrat","Helvetica Neue",Arial,sans-serif !important;
}

.ecwid div, .ecwid span, .ecwid a, .ecwid p,
.ec-store.ec-store div, .ec-store.ec-store span, .ec-store.ec-store p {
  color: #ffffff !important;
}

/* the display face has no punctuation or currency glyphs, so it is used only
   for headings — never for prices or anything with a symbol in it */
.ec-store.ec-store .product-details__product-title,
.ec-store.ec-store .ec-page-title,
.ec-store.ec-store h1.ec-header-h1 {
  font-family: "NCAA Illinois Fighting Illini","NCAA Fighting Illini", "Archivo Black","Anton",Impact,sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: .01em !important;
}

/* ==========================================================================
   2 · BUTTONS   (Buy now, Add to bag, Checkout)
   ========================================================================== */
.ec-store.ec-store .form-control--primary .form-control__button,
.ec-size .ec-store .form-control--primary .form-control__button {
  background-color: #F72800 !important;
  background-image: none !important;
  border-color: #F72800 !important;
  color: #ffffff !important;
  /* was black — unreadable on red */
  font-family: "Montserrat",Arial,sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  border-radius: 999px !important;
  transition: background-color .25s,color .25s,transform .2s,box-shadow .25s !important;
}

.ec-store.ec-store .form-control--primary .form-control__button:hover,
.ec-store.ec-store .form-control--primary .form-control__button:focus {
  background-color: #000000 !important;
  border-color: #F72800 !important;
  color: #ffffff !important;
  /* was black on black — invisible */
  transform: translateY(-1px) !important;
  box-shadow: 0 14px 34px -14px rgba(247, 40, 0, 0.95) !important;
}

/* the quieter secondary buttons */
.ec-store.ec-store .form-control--secondary .form-control__button {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  font-weight: 700 !important;
}

.ec-store.ec-store .form-control--secondary .form-control__button:hover {
  border-color: #F72800 !important;
  background: rgba(247, 40, 0, 0.12) !important;
}

/* ==========================================================================
   3 · PRICES   (this is one of the two that never matched before)
   ========================================================================== */
.ec-store.ec-store .ec-price-item,
.ec-store.ec-store .details-product-price__value,
.ec-store.ec-store .product-details__product-price .ec-price-item {
  color: #F72800 !important;
  font-weight: 800 !important;
}

.ec-store.ec-store .product-details .ec-price-item {
  font-size: 23px !important;
  line-height: 1.25 !important;
}

.ec-store.ec-store .grid-product__price .ec-price-item,
.ec-store.ec-store .grid-product__price-value {
  font-size: 17px !important;
  line-height: 1.3 !important;
}

.ec-store.ec-store .grid-product__price {
  margin-top: 4px !important;
}

/* ==========================================================================
   4 · PRODUCT PAGE   (the other one that never matched)
   ========================================================================== */
.ec-store.ec-store .product-details__product-title,
.ec-store.ec-store .product-details .product-details__product-title {
  color: #F72800 !important;
  font-size: 32px !important;
  /* was 45px — it wrapped mid-word */
  line-height: 1.14 !important;
  /* the display face sits tight, so open it up */
  letter-spacing: 0 !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  hyphens: none !important;
}

@media (max-width: 1024px) {
  .ec-store.ec-store .product-details__product-title,
.ec-store.ec-store .product-details .product-details__product-title {
    font-size: 27px !important;
  }
}

@media (max-width: 640px) {
  .ec-store.ec-store .product-details__product-title,
.ec-store.ec-store .product-details .product-details__product-title {
    font-size: 23px !important;
  }
}

/* the option labels and the description above the form */
.ec-store.ec-store .product-details-module__title,
.ec-store.ec-store .details-product-option__title,
.ec-store.ec-store .product-details__description-title {
  color: #ffffff !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  font-weight: 800 !important;
}

/* ==========================================================================
   5 · THE PRODUCT GRID
   ========================================================================== */
.ec-store.ec-store .grid__products .grid-product__wrap-inner {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  transition: border-color .3s,background .3s,transform .3s,box-shadow .3s !important;
}

.ec-store.ec-store .grid__products .grid-product__wrap-inner:hover {
  border-color: rgba(247, 40, 0, 0.75) !important;
  background: rgba(247, 40, 0, 0.06) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 26px 60px -30px #000 !important;
}

.ec-store.ec-store .grid-product__title-inner {
  color: #ffffff !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  /* the card is narrow, so keep it small */
  line-height: 1.35 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  hyphens: none !important;
}

@media (max-width: 640px) {
  .ec-store.ec-store .grid-product__title-inner {
    font-size: 13px !important;
  }
}

.ec-store.ec-store .grid-product:hover .grid-product__title-inner {
  color: #F72800 !important;
}

.ec-store.ec-store .grid-product__sold-out,
.ec-store.ec-store .product-details__product-sold-out {
  background: #F72800 !important;
  color: #ffffff !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

/* ==========================================================================
   6 · CONTROLS — sort, filters, links
   ========================================================================== */
.ec-store.ec-store .ec-link,
.ec-store.ec-store a.ec-link--muted {
  color: #F72800 !important;
}

.ec-store.ec-store .ec-link:hover {
  color: #ffffff !important;
}

.ec-store.ec-store .ec-filter__title,
.ec-store.ec-store .ec-sort__label,
.ec-store.ec-store .ec-sort__trigger {
  color: #ffffff !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  font-weight: 800 !important;
}

/* ==========================================================================
   7 · FORM FIELDS — the white-on-white trap
   The global white-text rule above also paints the elements Ecwid builds its
   inputs and dropdowns from, so field text can end up white on a white field
   at checkout. These put it back to near-black.
   ========================================================================== */
.ec-store.ec-store input,
.ec-store.ec-store textarea,
.ec-store.ec-store select,
.ec-store.ec-store .form-control__text,
.ec-store.ec-store .form-control__select,
.ec-store.ec-store .form-control input {
  color: #111111 !important;
  background-color: #ffffff !important;
  font-family: "Montserrat",Arial,sans-serif !important;
}

.ec-store.ec-store input::placeholder,
.ec-store.ec-store textarea::placeholder {
  color: #767676 !important;
}

.ec-store.ec-store .ec-dropdown__menu,
.ec-store.ec-store .ec-dropdown__menu div,
.ec-store.ec-store .ec-dropdown__menu span,
.ec-store.ec-store .ec-dropdown__menu a,
.ec-store.ec-store .form-control__select option {
  color: #111111 !important;
  background-color: #ffffff !important;
}

/* the label above a field stays white on the dark page */
.ec-store.ec-store .form-control__label,
.ec-store.ec-store .ec-form__title,
.ec-store.ec-store .form-control__label-text {
  color: #ffffff !important;
}

.ec-store.ec-store .form-control--error .form-control__text,
.ec-store.ec-store .form-control--error input {
  border-color: #F72800 !important;
}

/* ==========================================================================
   8 · CART AND CHECKOUT
   ========================================================================== */
.ec-store.ec-store .ec-cart__badge,
.ec-store.ec-store .ec-minicart__counter {
  background: #F72800 !important;
  color: #ffffff !important;
}

.ec-store.ec-store .ec-cart-item__price,
.ec-store.ec-store .ec-cart-summary__total .ec-cart-summary__price {
  color: #F72800 !important;
  font-weight: 800 !important;
}

.ec-store.ec-store .ec-cart-step__title,
.ec-store.ec-store .ec-confirmation__title {
  color: #ffffff !important;
  text-transform: uppercase !important;
}

/* ==========================================================================
   9 · SPACING — the store sits inside a full-width dark page
   ========================================================================== */
.ec-store.ec-store {
  padding-top: 0 !important;
}

.ec-store.ec-store .ec-store__content-wrapper {
  background: transparent !important;
}