/** Shopify CDN: Minification failed

Line 8:14 Expected ")" to end URL token

**/
@font-face {
  font-family: "Mariposa Sans";
  src: url({{ 'MariposaSansStd-Book.woff2' | asset_url }}) format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

.slideshow.desktop-height-image .slideshow__slide .slideshow__slide-bg img {
    object-fit: cover !important;
}

.header .thb-full-menu > li > a[href="/collections/aunties-outlet"] {
  color: #A20532 !important;
}


.badge.bogo50 {
  background-color: #A20532;
  color: #fff;
  font-weight: bold;
  text-transform: uppercase;
}

.badge.birthday-sale {
  background-color: #A20532;
  color: #fff;
  font-weight: bold;
  text-transform: uppercase;
}


@media (min-width: 2500px) {
.slideshow__slide-adapt-to-image {
    position: relative;
    padding-top: 22%;
}
}

 @media only screen and (min-width: 1068px) {
.columns.style4 {
    display: flex !important;
    flex-wrap: wrap;
    padding: 15px 0 0px 0;
}
   
.style4 .logolink {
    display: inline-flex;
    margin: 20px 0;
    margin: 0 auto;
    width: 51.5%;
    display: flex;
    justify-content: end;
    align-items: center;
}

.style4 .thb-secondary-area {
    min-width: 135px;
    width: 45%;
    min-width: 45%;
}
 
.style4 .menu-logo-container {
    width: 100%;
    border-bottom: 1px solid;
/* Original, updated by LM 3/19/24  
    border-color: var(--color-footer-border, --color-form-border);
*/  
    border-color: #DEDEDE;  
    display: flex !important;
    justify-content: center;
    align-items: center;
    padding-bottom: 15px;
}
.style4 full-menu.full-menu {
    padding-top: 0px;
}
   .monile-style-4 {
    display: none;
}
   .header .row.expanded {
    padding: 0;
}
   .style4 .thb-secondary-area {
    padding-right: 20px;
}
}
 @media only screen and (max-width: 1068px) {
   .monile-style-4 {
    display: flex;
    align-items: center;
}
  .menu-logo-container.cstm-desk-style4 {
    display: none;
}
.small-12.columns.style4 {
    grid-template-columns: 1fr auto;
}
   
 }



@media (min-width: 1068px) and (max-width: 1200px) {
.style4 .menu-logo-container {
    margin-left: 90px;
}
}

/* ============================================================
   HH custom overrides re-applied after the Habitat 12.0.0 upgrade.
   Originally edited directly in core files (product-grid.css, page-header.css)
   which the upgrade overwrote. Moved here so they survive future upgrades.
   !important is required because those core stylesheets load after custom.css.
   ============================================================ */

/* Product-card color swatches — restore LM 3/5/24 sizing (28px; upgrade reverted to 14px) */
.product-card .product-card-swatches .product-card-swatch {
    width: 28px !important;
    height: 28px !important;
    border-radius: 14px !important;
    color: transparent !important;
}
.product-card .product-card-swatches .product-card-swatch:after {
    border-radius: 16px !important;
}

/* Page/collection header inner width — restore LM 09/24/24 value (1200px; upgrade reverted to 720px) */
.page-header__inner {
    max-width: 1200px !important;
}

/* Judge.me review widget — star/accent color switched from the initial teal match to Hilo Hattie's
   brand red (#A20532, same red used for the Aunties Outlet nav link and sale badges above), per
   follow-up feedback (2026-08-17). Judge.me sets its own --jdgm-* vars at runtime, after custom.css
   loads, so !important is needed to win the cascade regardless of injection order. Write-review-bg
   intentionally NOT red here — see the CTA override below: the "Write a review" button matches the
   site's standard solid-button brown instead, per Heidi's branding feedback (2026-08-17).
   NOTE (2026-08-17): the review_widget's separate hydration issue (see theme.liquid history) was
   confirmed unrelated to this color change — reverting it did not fix the widget, so it's restored. */
:root {
    --jdgm-primary-color: #A20532 !important;
    --jdgm-secondary-color: rgba(162, 5, 50, 0.1) !important;
    --jdgm-star-color: #A20532 !important;
    --jdgm-paginate-color: #A20532 !important;
    --jdgm-reviewer-name-color: #A20532 !important;
}

/* The "review_widget" app block (the full, below-the-fold review list — distinct from the
   preview_badge/summary widget above) is a newer Judge.me component that ignores the --jdgm-*
   vars entirely and reads its own --jm-review-widget-* namespace instead (confirmed 2026-08-17
   via its rendered inline styles: stars/histogram bars reference
   var(--jm-review-widget-star-and-histogram-color) directly). Matched to HH red here too so the
   detail review stars aren't left teal after the summary widget above was already switched.
   Setting this only at :root isn't enough — the widget's own root element re-declares this same
   variable via its own inline style (a plain, non-!important override), and a directly-targeted
   declaration always wins over an inherited one regardless of the ancestor's !important. Re-declaring
   it with !important on every element inside #judgeme_product_reviews (including the widget's own
   root div) is what's needed to actually beat that inline redeclaration. */
#judgeme_product_reviews,
#judgeme_product_reviews * {
    --jm-review-widget-star-and-histogram-color: #A20532 !important;
}

/* Judge.me review widget — Heidi's branding feedback (2026-08-17):
   - Font already inherits the site's font automatically (Instrument Sans), no override needed.
   - General widget text (headings, review body, reviewer info) forced from Judge.me's default
     black to the site's dark brown text color (matches --color-accent / header & footer text),
     excluding the star icons (kept teal per the earlier request above) and primary buttons
     (styled separately below).
   - "Write a review" / form submit buttons matched to the site's standard solid-button look
     (dark brown bg, cream label) instead of the teal accent, for CTA consistency sitewide.
   NOTE (2026-08-17): the user has since configured secondary/lighter text to light brown
   (#AF876F) directly in Judge.me's own widget settings panel — confirmed via the widget's
   per-review inline style, which already sets --jm-review-widget-lighter-text-color: #AF876F.
   Elements that consume that variable (e.g. .jm-shop-reply__author) are excluded below via an
   attribute selector so this blanket rule doesn't flatten them back to dark brown; no separate
   color rule is needed for them since their own inline var() already resolves correctly.
   NOTE (2026-08-17): the "Filters" toggle button (.jm-custom-answer-filter) also needed excluding —
   Judge.me fills its own background with the widget's dark-brown text color when toggled to its
   "--active" (clicked) state, and this blanket rule was forcing that same dark brown onto its icon
   and label too, making both disappear into the button's own background. Excluded below and given
   an explicit cream color instead, matching the same dark-bg/light-text pattern already used for
   the "Write a review" button and the "Verified" badge.
   NOTE (2026-08-17): the sort <select> (.jm-sort-filter__select) also needed excluding — this
   blanket rule's long :not() chain gives it more specificity than the dedicated
   "color: transparent" rule below meant to hide the select's own rendered text (see that rule's
   comment), so without this exclusion the blanket rule was winning and making the text visible
   again despite the more targeted rule. */
#judgeme_product_reviews,
#judgeme_product_reviews *:not(.jm-star-rating):not(.jm-star-rating *):not(.jm-button--primary):not(.jm-button--primary *):not(.jm-verified-badge):not(.jm-verified-badge *):not([style*="lighter-text-color"]):not(.jm-custom-answer-filter--active):not(.jm-custom-answer-filter--active *):not(.jm-sort-filter__select) {
    color: #3B2B2B !important;
}
#judgeme_product_reviews .jm-custom-answer-filter--active,
#judgeme_product_reviews .jm-custom-answer-filter--active * {
    color: #F6F6F0 !important;
}
#judgeme_product_reviews .jm-button--primary {
    background-color: #3B2B2B !important;
    border-color: #3B2B2B !important;
    color: #F6F6F0 !important;
}
/* Sort icon (the up/down arrows button next to "Filters") — Judge.me's own SVG for this is a
   compound arrow-up-over-arrow-down shape that, filled solid at ~17px, reads as an illegible blob
   rather than two distinct arrows (confirmed 2026-08-17 against a reference image). Can't edit
   Judge.me's SVG directly since it's generated by their JS, not a theme file, so their icon is
   hidden and replaced with a clean standard "swap vertical" glyph via CSS mask — this keeps it
   tinted with currentColor so it still follows the widget's text-color styling automatically. */
#judgeme_product_reviews .jm-sort-filter__icon--sort svg {
    display: none !important;
}
#judgeme_product_reviews .jm-sort-filter__icon--sort {
    display: inline-block !important;
}
#judgeme_product_reviews .jm-sort-filter__icon--sort::before {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M9 3L5 6.99h3V14h2V6.99h3L9 3zm7 14.01V10h-2v7.01h-3L15 21l4-3.99h-3z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M9 3L5 6.99h3V14h2V6.99h3L9 3zm7 14.01V10h-2v7.01h-3L15 21l4-3.99h-3z'/></svg>");
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}
/* Root cause of the letter appearing "over" the sort icon (2026-08-17): it was never the icon —
   the native <select> element always renders its own currently-selected option's text inside its
   box, and since the box is ~42px wide with overflow visible, only the first letter shows before
   getting cut off (e.g. "Most recent" -> "M", "Lowest rating" -> "L"), layered right behind our
   custom icon above. The accessible label is already provided via the visually-hidden <label> in
   Judge.me's markup, so the select's own displayed text isn't needed and is hidden here. Scoped to
   the closed/collapsed select only — its native open dropdown list is unaffected since options
   get their own color reset below, so "Most recent" / "Highest rating" / etc. stay legible there. */
#judgeme_product_reviews .jm-sort-filter__select {
    color: transparent !important;
}
#judgeme_product_reviews .jm-sort-filter__select option {
    color: #3B2B2B !important;
}
/* "Verified" badge — Judge.me hardcodes this to a blue/mint-green with no CSS variable exposed.
   First pass matched it to the site's dark brown (Heidi's 2026-08-17 feedback), but a dark bg with
   the black check icon/text read poorly. Switched to a lightened tint of the site's existing brand
   red (#A20532, used for the Aunties Outlet nav link and sale badges above) — light enough for the
   black check icon and "Verified" label to stay legible, per follow-up feedback (2026-08-17). */
#judgeme_product_reviews .jm-verified-badge {
    background-color: #E8C1CC !important;
    color: #000000 !important;
}

/* Judge.me "Write a review" modal — a separate, older legacy component (.jdgm-star, rendered as
   its own overlay appended outside #judgeme_product_reviews, so none of the scoped rules above
   reach it). Its star icons hardcode Judge.me's default teal directly (not driven by any of the
   --jdgm-* or --jm-* variables used elsewhere), for both the unselected and hover/selected states,
   so they need a direct color override to match HH red (2026-08-17). */
.jdgm-write-review-modal .jdgm-star {
    color: #A20532 !important;
}

/* Judge.me "Write a review" modal — the "Next" (step 2+) and "Close" (final step submit) nav
   buttons are the modal's solid CTAs and hardcode Judge.me's default teal, same as the stars above.
   Matched to the site's standard solid-button brown/cream, consistent with the .jm-button--primary
   override used for the main review widget's CTA (2026-08-17). The "Back" nav button is an
   outline/ghost style, not a CTA, so it's left as-is. */
.jdgm-write-review-modal__nav-btn-next,
.jdgm-write-review-modal__nav-btn-close {
    background-color: #3B2B2B !important;
    border-color: #3B2B2B !important;
    color: #F6F6F0 !important;
}

/* Native star-rating badge (product title) — use the exact same glyph as Judge.me's widget
   instead of the theme's default Unicode "★", so the two look identical, not just same color.
   Font embedded from Judge.me's own injected @font-face (star glyph = U+E000). */
@font-face {
    font-family: "JudgemeStar";
    src: url("data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAAScAA0AAAAABrAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAEgAAAABoAAAAcbyQ+3kdERUYAAARgAAAAHgAAACAAMwAGT1MvMgAAAZgAAABGAAAAVi+vS9xjbWFwAAAB8AAAAEAAAAFKwBMjvmdhc3AAAARYAAAACAAAAAj//wADZ2x5ZgAAAkAAAAEJAAABdH33LXtoZWFkAAABMAAAAC0AAAA2BroQKWhoZWEAAAFgAAAAHAAAACQD5QHQaG10eAAAAeAAAAAPAAAAFAYAAABsb2NhAAACMAAAAA4AAAAOAO4AeG1heHAAAAF8AAAAHAAAACAASgAvbmFtZQAAA0wAAADeAAABkorWfVZwb3N0AAAELAAAACkAAABEp3ubLXgBY2BkYADhPPP4OfH8Nl8ZuJkYQODS2fRrCPr/aSYGxq1ALgcDWBoAO60LkwAAAHgBY2BkYGDc+v80gx4TAwgASaAICmABAFB+Arl4AWNgZGBgYGPQYWBiAAIwyQgWc2AAAwAHVQB6eAFjYGRiYJzAwMrAwejDmMbAwOAOpb8ySDK0MDAwMbByMsCBAAMCBKS5pjA4PGB4wMR44P8BBj3GrQymQGFGkBwAjtgK/gAAeAFjYoAAEA1jAwAAZAAHAHgB3crBCcAwDEPRZydkih567CDdf4ZskmLwFBV8xBfCaC4BXkOUmx4sU0h2ngNb9V0vQCxaRKIAevT7fGWuBrEAAAAAAAAAAAA0AHgAugAAeAF9z79Kw1AUx/FzTm7un6QmJtwmQ5Bg1abgEGr/BAqlU6Gju+Cgg1MkQ/sA7Vj7BOnmO/gUvo2Lo14NqIO6/IazfD8HEODtmQCfoANwNsyp2/GJt3WKQrd1NLiYYWx2PBqOsmJMEOznPOTzfSCrhAtbbLdmeFLJV9eKd63WLrZcIcuaEVdssWCKM6pLCfTVOYbz/0pNSMSZKLIZpvh78sAUH6PlMrreTCabP9r+Z/puPZ2ur/RqpQHgh+MIegCnXeM4MRAPjYN//5tj4ZtTjkFqEdmeMShlEJ7tVAly2TAkx6R68Fl4E/aVvn8JqHFQ4JS1434gXKcuL31dDhzs3YbsEOAd/IU88gAAAHgBfY4xTgMxEEVfkk0AgRCioKFxQYd2ZRtpixxgRU2RfhU5q5VWseQ4JdfgAJyBlmNwAM7ABRhZQ0ORwp7nr+eZAa54YwYg9zm3ynPOeFRe8MCrciXOh/KSS76UV5L/iDmrLiS5AeU519wrL3jmSbkS5115yR2fyivJv9kx0ZMZ2RLZw27q87iNQi8EBo5FSPIMw3HqBboi5lKTGAGDp8FKXWP+t9TU01Lj5His1Ba6uM9dTEMwvrFmbf5GC/q2drW3ruXUhhsCiQOjznFlCzYhHUZp4xp76vsvQh89CQAAeAFjYGJABowM6IANLMrEyMTIzMjCXpyRWJBqZshWXJJYBKOMAFHFBucAAAAAAAAB//8AAngBY2BkYGDgA2IJBhBgAvKZGViBJAuYxwAABJsAOgAAeAFjYGBgZACCk535hiD60tn0azAaAEqpB6wAAA==") format("woff");
    font-weight: normal;
    font-style: normal;
}
.star-rating {
    font-family: "JudgemeStar", Times !important;
}
.star-rating:before {
    content: "\e000\e000\e000\e000\e000" !important;
}