/* Shared customer Help & Support and service-footer presentation. */
:root {
  --customer-content-max: 80rem;
  --customer-content-gutter: 1.5rem;
}

.customer-content-rail {
  box-sizing: border-box;
  width: min(
    var(--customer-content-max),
    calc(100% - (2 * var(--customer-content-gutter)))
  );
  margin-inline: auto;
}

/* Keep service wordmarks on one sizing contract across headers and footers. */
.service-header__brand-logo {
  display: block;
  width: 10.375rem;
  max-width: calc(100vw - 2rem);
  height: 2.5rem;
  object-fit: cover;
  object-position: center;
  flex: 0 0 auto;
}
.service-header__brand {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  min-width: 0;
}
.service-header__brand-mark {
  display: block;
  width: auto;
  height: 1.5rem;
  flex: 0 0 auto;
}
.service-header__brand-name {
  color: #0d1f1e;
  font-size: 1.25rem;
  font-weight: 900;
  letter-spacing: -.025em;
  line-height: 1;
  white-space: nowrap;
}
.customer-footer .service-header__brand-name { color: #fff; }

.service-header__main-nav {
  box-sizing: border-box;
  min-height: 4.5rem;
  padding-block: 0 !important;
  grid-template-columns: max-content max-content minmax(18rem, 1fr) max-content;
  align-items: center;
  gap: 1.5rem;
}
.service-header__brand-link,
.service-header__location,
.service-header__search,
.service-header__actions { min-width: 0; }
.service-header__location { width: min(10rem, 100%); }
.service-header__search { width: 100%; }
.service-header__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .625rem;
  min-width: 0;
}
.customer-header__service-actions {
  grid-auto-flow: column;
  grid-auto-columns: 5.5rem;
  align-items: stretch;
  gap: .25rem;
}
.customer-header__action {
  display: inline-flex;
  min-width: 0;
  min-height: 3.5rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .25rem;
  text-align: center;
}
.customer-header__action-icon {
  position: relative;
  display: grid;
  width: 1.75rem;
  height: 1.75rem;
  place-items: center;
}
.customer-header__action-icon > svg,
.customer-header__action-icon > i {
  width: 1.5rem;
  height: 1.5rem;
}
.customer-header__action-label {
  min-height: 1rem;
  font-size: .8125rem;
  font-weight: 600;
  line-height: 1rem;
  white-space: nowrap;
}
.customer-header__cart-badge {
  position: absolute;
  top: -.25rem;
  right: -.45rem;
  display: inline-flex;
  min-width: 1.25rem;
  height: 1.25rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #fcbf49;
  padding-inline: .3rem;
  color: #0d1f1e;
  font-size: .625rem;
  font-weight: 900;
  line-height: 1;
}
.service-header__location-trigger {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr) 1rem;
  align-items: center;
  column-gap: .625rem;
  min-width: 11rem;
  max-width: 13rem;
  width: 100%;
  height: 3.5rem;
  padding-inline: .75rem;
}
.service-header__location-icon {
  display: grid;
  width: 2.25rem;
  height: 2.25rem;
  place-items: center;
  border-radius: 999px;
}
.service-header__location-copy { min-width: 0; }
.service-header__location-eyebrow,
.service-header__location-value {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (min-width: 64rem) {
  .service-header__main-nav { display: grid !important; }
}

@media (max-width: 70rem) {
  .service-header__brand-logo {
    width: 9.3125rem;
    height: 2.25rem;
  }
  .service-header__main-nav { gap: 1rem; }
  .service-header__location { width: min(9rem, 100%); }
}

@media (max-width: 63.99rem) {
  .service-header__main-nav { display: none !important; }
}

@media (max-width: 48rem) {
  .service-header__brand-logo {
    width: 8.3125rem;
    height: 2rem;
  }
}

.customer-footer {
  --customer-footer-muted: rgba(255, 255, 255, 0.72);
  position: relative;
  z-index: 10;
  margin-top: 3rem;
  color: var(--customer-footer-muted);
}
.customer-footer__inner {
  padding: 3rem 0 1.25rem;
}
.customer-footer__brand { min-width: 0; }
.customer-footer__wordmark {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: #fff;
  min-height: 2.75rem;
  line-height: 1;
}
.customer-footer__logo { display: block; }
.customer-footer__wordmark-label { color: #fff; }
.customer-footer__tagline { max-width: 20rem; margin-top: .85rem; font-size: .875rem; line-height: 1.6; }
.customer-footer__socials { display: flex; gap: 1rem; margin-top: 1.25rem; }
.customer-footer__social-link { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; color: #fff; line-height: 0; transition: color .18s ease, transform .18s ease; }
.customer-footer__social-link:hover { color: #00c4b5; transform: translateY(-1px); }
.customer-footer__social-link--disabled { color: rgba(255,255,255,.45); cursor: not-allowed; }
.customer-footer__social-link svg { display: block; width: 1.25rem; height: 1.25rem; }
.customer-footer__groups { display: grid; }
.customer-footer__group { border-top: 1px solid rgba(255,255,255,.2); }
.customer-footer__group:last-child { border-bottom: 1px solid rgba(255,255,255,.2); }
.customer-footer__group summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 0; color: #fff; font-weight: 700; cursor: pointer; list-style: none; }
.customer-footer__group summary::-webkit-details-marker { display: none; }
.customer-footer__group summary svg { width: 1.1rem; height: 1.1rem; transition: transform .18s ease; }
.customer-footer__group[open] summary svg { transform: rotate(180deg); }
.customer-footer__group nav { display: grid; gap: .6rem; padding: 0 0 1rem; font-size: .875rem; }
.customer-footer__group a:hover, .customer-footer__legal a:hover { color: #fff; }
.customer-footer__disabled-link { color: rgba(255,255,255,.58); cursor: default; }
.customer-footer__utilities { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid rgba(255,255,255,.2); }
.customer-footer__utility, .customer-footer__utilities .customer-language-switcher summary { display: inline-flex; align-items: center; gap: .55rem; min-height: 2.5rem; color: #fff; font-size: .875rem; }
.customer-footer__utility svg { width: 1.15rem; height: 1.15rem; }
.customer-footer__utility-links { display: flex; flex-wrap: wrap; gap: .75rem 1rem; grid-column: 1 / -1; border-top: 1px solid rgba(255,255,255,.2); padding-top: .75rem; }
.customer-footer__utility-links a { display: inline-flex; min-height: 2.75rem; align-items: center; color: #fff; font-size: .875rem; }
.customer-footer__utilities .customer-language-switcher { position: relative; }
.customer-footer__utilities .customer-language-switcher summary { padding: 0; cursor: pointer; list-style: none; }
.customer-footer__utilities .customer-language-switcher summary::-webkit-details-marker { display: none; }
.customer-footer__utilities .customer-language-switcher summary svg:last-child { width: 1rem; height: 1rem; }
.customer-footer__utilities .customer-language-switcher > div { right: auto; left: 0; bottom: calc(100% + .5rem); top: auto; }
.customer-footer__utilities .customer-language-switcher summary > svg:first-child { width: 1.15rem; height: 1.15rem; }
.customer-footer__utilities .customer-language-switcher summary span { color: #fff; }
.customer-footer__legal { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,.2); font-size: .75rem; }
.customer-footer__legal-links { display: flex; flex-wrap: wrap; gap: 1rem; }

@media (min-width: 1200px) {
  .customer-footer__inner { display: grid; grid-template-columns: minmax(14rem, 1.15fr) repeat(3, minmax(9rem, .8fr)) minmax(18rem, 1.2fr); align-items: stretch; gap: clamp(1.25rem, 2.2vw, 3rem); padding-top: 2.75rem; }
  .customer-footer__groups { display: contents; }
  .customer-footer__brand { grid-column: 1; padding-right: 0; }
  .customer-footer__group { border-top: 0; border-inline-start: 1px solid rgba(255,255,255,.28); padding: 0 0 0 clamp(1.25rem, 2vw, 2.5rem); }
  .customer-footer__group:nth-child(1) { grid-column: 2; }
  .customer-footer__group:nth-child(2) { grid-column: 3; }
  .customer-footer__group:nth-child(3) { grid-column: 4; }
  .customer-footer__group:last-child { border-bottom: 0; }
  .customer-footer__group summary { padding: 0 0 1rem; cursor: default; }
  .customer-footer__group summary svg { display: none; }
  .customer-footer__group nav { padding: 0; }
  .customer-footer__utilities { grid-column: 5; grid-row: 1; display: flex; flex-wrap: wrap; align-content: start; justify-content: space-between; gap: .75rem; margin: 0; padding: 0 0 1.5rem 0; border: 0; border-bottom: 1px solid rgba(255,255,255,.2); }
  .customer-footer__utilities .customer-footer__utility-links { flex-basis: 100%; grid-column: auto; }
  .customer-footer__legal { grid-column: 5; grid-row: 2; align-self: end; margin: 0; padding: 1rem 0 0; border: 0; }
  .customer-footer[data-food-delivery-site-footer] .customer-footer__legal { grid-column: 1 / -1; grid-row: 2; }
}

@media (max-width: 1199px) {
  .customer-footer__utilities .customer-language-switcher summary { color: #fff; }
  .customer-footer__legal { display: grid; }
}

.customer-help { padding: 2rem 0 0; }
.customer-help__breadcrumb { display: flex; gap: .6rem; color: #5c6e82; font-size: .8rem; font-weight: 700; }
.customer-help__breadcrumb a { color: #087f76; }
.customer-help h1 { margin-top: .75rem; color: #0d1f1e; font-size: clamp(2rem, 3.5vw, 3rem); font-weight: 800; line-height: 1.05; letter-spacing: -.04em; }
.customer-help__intro { max-width: 46rem; margin-top: .75rem; color: #52657b; font-size: 1.05rem; line-height: 1.6; }
.customer-help__search { display: flex; align-items: center; min-height: 3.5rem; margin-top: 1.25rem; border: 1px solid rgba(13,31,30,.16); border-radius: 1.2rem; background: #fff; padding: .5rem 1rem; }
.customer-help__search .customer-search-input { font-size: .95rem; }
.customer-help__tasks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }
.customer-help__task, .customer-help__panel { border: 1px solid rgba(13,31,30,.1); border-radius: 1rem; background: rgba(255,255,255,.75); }
.customer-help__task { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: .8rem; padding: 1rem; color: #0d1f1e; }
.customer-help__icon { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border-radius: 999px; background: #e0f5f1; color: #087f76; }
.customer-help__icon svg { width: 1.25rem; height: 1.25rem; }
.customer-help__task strong { font-size: .875rem; }
.customer-help__task span { display: block; margin-top: .25rem; color: #52657b; font-size: .78rem; line-height: 1.45; }
.customer-help__task > .customer-help__icon,
.customer-help__contact a > .customer-help__icon { display: inline-flex; align-items: center; justify-content: center; margin-top: 0; color: #087f76; line-height: 0; }
.customer-help__icon > svg { display: block; flex: none; }
.customer-help__task > svg { width: 1.1rem; height: 1.1rem; align-self: center; }
.customer-help__body { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(18rem, .75fr); gap: 1rem; margin-top: 1rem; }
.customer-help__panel { padding: 1.25rem; }
.customer-help__panel h2 { color: #0d1f1e; font-size: 1.2rem; font-weight: 800; }
.customer-help__faq { margin-top: .75rem; }
.customer-help__faq details { border-top: 1px solid rgba(13,31,30,.1); }
.customer-help__faq details:last-child { border-bottom: 1px solid rgba(13,31,30,.1); }
.customer-help__faq summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 0; color: #0d1f1e; font-size: .9rem; cursor: pointer; list-style: none; }
.customer-help__faq summary::-webkit-details-marker { display: none; }
.customer-help__faq summary svg { width: 1rem; height: 1rem; flex: none; }
.customer-help__contact-intro { margin-top: .25rem; color: #52657b; font-size: .875rem; }
.customer-help__contact { display: grid; gap: .6rem; margin-top: .8rem; }
.customer-help__contact a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .75rem; border: 1px solid rgba(13,31,30,.12); border-radius: .8rem; padding: .75rem; color: #0d1f1e; }
.customer-help__contact a:hover { border-color: #2aaa9c; }
.customer-help__contact a strong { font-size: .85rem; }
.customer-help__contact a span { display: block; margin-top: .15rem; color: #52657b; font-size: .75rem; }
.customer-help__contact a > .customer-help__icon { color: #087f76; }
.customer-help__contact a > svg { width: 1rem; height: 1rem; }
.customer-help__back { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1rem; color: #087f76; font-size: .85rem; font-weight: 700; }
.customer-help__legacy { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

@media (max-width: 48rem) {
  .customer-content-rail { --customer-content-gutter: 1rem; }
}

@media (max-width: 767px) {
  .customer-help { padding-top: 1.25rem; }
  .customer-help__tasks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .customer-help__task { grid-template-columns: auto minmax(0, 1fr); padding: .8rem; }
  .customer-help__task > svg { display: none; }
  .customer-help__body { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: no-preference) {
  .motion-ready [data-motion-reveal][data-motion-pending="true"] {
    opacity: 0;
    transform: translateY(14px);
  }

  .motion-ready [data-motion-reveal] {
    transition: opacity 420ms ease, transform 420ms ease;
  }

  .motion-ready [data-motion-reveal][data-motion-revealed="true"] {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-motion-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .customer-footer *, .customer-help * { transition-duration: .01ms !important; }
}
