/* WordPress chrome and progressive enhancement around the approved component styles. */
.admin-bar .nx-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .nx-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .nx-header { top: 0; } }
.nx-logo__word { white-space: nowrap; }
@media (min-width: 1025px) {
  .nx-nav .menu-item:focus-within > .sub-menu { display: block; }
  html:not(.nexo-js) .nx-nav .menu-item:hover > .sub-menu { display: block; }
}
@media (max-width: 1024px) {
  html:not(.nexo-js) .nx-drawer { position: static; width: 100%; transform: none; visibility: visible; box-shadow: none; }
  html:not(.nexo-js) .nx-drawer__head, html:not(.nexo-js) .nx-header__burger { display: none; }
  html:not(.nexo-js) .nx-search { display: block; grid-column: 1 / -1; grid-row: 2; padding-bottom: 12px; }
  html:not(.nexo-js) .nx-search-toggle { display: none; }
  html:not(.nexo-js) .nx-nav .sub-menu { display: block; }
}
/* WooCommerce's `.woocommerce-page img { height: auto }` outranks the logo rules on store pages. */
.woocommerce img.nx-logo__mark, .woocommerce-page img.nx-logo__mark { height: 46px; }
@media (max-width: 1024px) {
  .woocommerce img.nx-logo__mark, .woocommerce-page img.nx-logo__mark { height: 38px; }
  .woocommerce .nx-logo--drawer img.nx-logo__mark, .woocommerce-page .nx-logo--drawer img.nx-logo__mark { height: 34px; }
}
/* WooCommerce info/success notices in the prototype .notice style (C39), with its outlined icon. */
.woocommerce-info, .woocommerce-message {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 0 0 24px; padding: 16px 20px;
  background: #f7f6f7; border-top: 3px solid var(--c-primary); color: #515151; font-size: 15px;
}
.woocommerce-info::before, .woocommerce-message::before {
  content: ""; position: static; flex: none; width: 18px; height: 18px; background: var(--c-primary);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='5' width='18' height='15' rx='1'/%3E%3Cpath d='M3 9h18'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='5' width='18' height='15' rx='1'/%3E%3Cpath d='M3 9h18'/%3E%3C/svg%3E") center / contain no-repeat;
}
.woocommerce-info .button, .woocommerce-message .button { margin-left: auto; order: 2; }
/* WooCommerce buttons on Cart/Checkout/Account take the prototype .btn look (Woo's `.woocommerce a.button` rules lose here). */
.woo-page .woocommerce a.button, .woo-page .woocommerce button.button, .woo-page .woocommerce input.button,
.woo-page .woocommerce a.button.alt, .woo-page .woocommerce button.button.alt, .woo-page .woocommerce #respond input#submit {
  display: inline-block; border: 0; border-radius: var(--radius-btn); padding: 17px 40px;
  font-family: var(--f-poppins); font-size: 16px; font-weight: 500; line-height: 1; text-align: center;
  color: #fff; background: var(--c-primary-aa); transition: background-color var(--t-fast), opacity var(--t-fast);
}
.woo-page .woocommerce a.button:hover, .woo-page .woocommerce button.button:hover, .woo-page .woocommerce input.button:hover,
.woo-page .woocommerce a.button.alt:hover, .woo-page .woocommerce button.button.alt:hover { color: #fff; background: var(--c-heading-dark); }
.woo-page .woocommerce button.button:disabled, .woo-page .woocommerce button.button.disabled, .woo-page .woocommerce button.button:disabled[disabled] { opacity: .5; cursor: not-allowed; color: #fff; background: var(--c-primary-aa); padding: 17px 40px; }
/* Brand type: headings in Outfit, tighter tracking; text in Inter. */
body { font-family: var(--f-text); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
h1, h2, h3, h4, .section-heading__title, .hero__title, .page-hero__title, .summary__title, .product_title, .shop-header__title, .qv__title, .woo-page__title, .drawer__title { font-family: var(--f-display); letter-spacing: -.01em; }
.btn, button, input, select, textarea { font-family: inherit; }
.btn { font-family: var(--f-display); font-weight: 600; letter-spacing: .01em; }
.price, .amount { font-variant-numeric: tabular-nums; }
