/**
 * The cart in the site header.
 *
 * This is the one stylesheet the module attaches to every page, because the
 * cart is now on every page. Everything else it ships is scoped to the pages
 * that need it.
 *
 * The theme puts each header block on its own row, which left the cart as a
 * bare icon and a line of text hanging under the navigation. A customer who
 * adds a build and clicks away needs to see it without hunting for it, so it
 * sits where a shopper looks for a cart: the top right of the header.
 *
 * Positioned rather than floated so it does not disturb the branding and menu
 * already in that region, and returned to the normal flow on a narrow screen
 * where there is no room beside the logo.
 */

.region-header-first {
  position: relative;
}

#block-corporateplus-cart {
  position: absolute;
  top: 8px;
  right: 0;
  margin: 0;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 14px;
  font-weight: 600;
}

/*
 * The block is a single link to the cart. Commerce's dropdown is switched off
 * in the block settings, so there is no panel to position here.
 */
#block-corporateplus-cart .cart-block--link__expand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #F5F5F3;
  text-decoration: none;
}

#block-corporateplus-cart .cart-block--link__expand:hover,
#block-corporateplus-cart .cart-block--link__expand:focus {
  color: #E5485D;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Keeps the icon from stretching against the count beside it. */
#block-corporateplus-cart .cart-block--summary__icon {
  flex: none;
  line-height: 0;
}

@media (max-width: 860px) {
  #block-corporateplus-cart {
    position: static;
    margin: 12px 0;
  }
}