/* =========================================================
   My account pages

   Everything these pages look like, on bare markup: WooCommerce's
   stylesheets are off here (see LSB2B_Account). Fonts and heading
   styles come from the theme. Colours and radii take the theme's
   tokens when they exist and otherwise fall back to a neutral look.
========================================================= */

.lsb2b-account {
  --acc-ink: var(--color-inverted, #1d1d1f);
  --acc-muted: var(--color-inverted-muted, #6e6e73);
  --acc-primary: var(--color-primary, #1d1d1f);
  --acc-primary-hover: color-mix(in srgb, var(--acc-primary) 84%, #000);
  --acc-accent: var(--color-accent, #1d1d1f);
  --acc-tint: color-mix(in srgb, var(--acc-primary) 8%, #fff);
  --acc-canvas: var(--color-secondary-soft, #f5f5f4);
  --acc-surface: var(--color-surface, #fff);
  --acc-on-panel: var(--color-secondary, #fff);
  --acc-line: rgba(29, 29, 31, .10);
  --acc-line-strong: rgba(29, 29, 31, .24);
  --acc-danger: var(--color-danger-strong, #8f2e2e);
  --acc-radius-s: var(--radius-sm, 12px);
  --acc-radius-m: var(--radius-md, 18px);
  --acc-radius-l: var(--radius-lg, 24px);
  --acc-gap: 24px;
}

/* WooCommerce's stylesheet is what defines this class. */
.lsb2b-account .screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  border: 0;
  white-space: nowrap;
}

.lsb2b-account main {
  background: var(--acc-canvas);
}

.lsb2b-account .entry-title {
  margin: 0 0 clamp(24px, 3vw, 40px);
  color: var(--acc-primary);
  font-size: clamp(34px, 4.4vw, 52px);
}

.woocommerce-MyAccount-content a:where(:not([class*="button"], [class*="lsb2b-"])),
.lsb2b-account .woocommerce-form a,
.lsb2b-account .woocommerce-LostPassword a {
  color: var(--acc-primary);
  text-underline-offset: 3px;
}

.lsb2b-account .woocommerce :focus-visible {
  outline: 2px solid var(--acc-primary);
  outline-offset: 2px;
}

/* ---------------------------------------------------------
   Layout
--------------------------------------------------------- */

.lsb2b-account.logged-in .woocommerce {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  gap: clamp(24px, 3vw, 40px);
  align-items: start;
}

/* Anything another plugin prints next to these two takes the full width. */
.lsb2b-account.logged-in .woocommerce > * {
  grid-column: 1 / -1;
}

.lsb2b-account.logged-in .woocommerce > .woocommerce-MyAccount-navigation {
  grid-column: 1;
}

.lsb2b-account.logged-in .woocommerce > .woocommerce-MyAccount-content {
  grid-column: 2;
}

.woocommerce-MyAccount-content {
  container: lsb2b-content / inline-size;
  display: flex;
  flex-direction: column;
  gap: var(--acc-gap);
  min-width: 0;
}

.woocommerce-MyAccount-content > * {
  min-width: 0;
  margin-block: 0;
}

.woocommerce-MyAccount-content .woocommerce-notices-wrapper:empty {
  display: none;
}

/* A flex column would stretch a loose button over the full width. */
.woocommerce-MyAccount-content > .button {
  align-self: flex-start;
}

.lsb2b-account:not(.logged-in) .entry-title {
  text-align: center;
}

.lsb2b-account:not(.logged-in) .woocommerce {
  max-width: 480px;
  margin-inline: auto;
}

/* ---------------------------------------------------------
   Icons, for the navigation and the dashboard shortcuts
--------------------------------------------------------- */

.woocommerce-MyAccount-navigation-link,
.lsb2b-shortcut {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--dashboard {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11.5 12 5l8 6.5'/%3E%3Cpath d='M6 10v9h12v-9'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--orders {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8l8-4 8 4v8l-8 4-8-4z'/%3E%3Cpath d='M4 8l8 4 8-4M12 12v8'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--edit-address,
.lsb2b-shortcut--edit-address {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-6.2 7-11.5A7 7 0 0 0 5 9.5C5 14.800 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.500' r='2.500'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--payment-methods,
.lsb2b-shortcut--payment-methods {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2.500'/%3E%3Cpath d='M3 10h18M7 15h3'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--downloads,
.lsb2b-shortcut--downloads {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11M7.500 11 12 15.500 16.500 11M5 20h14'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--edit-account,
.lsb2b-shortcut--edit-account {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8.500' r='3.500'/%3E%3Cpath d='M5 20c.8-3.700 3.500-5.500 7-5.500s6.200 1.800 7 5.500'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--customer-logout {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 4H6v16h4M15 8l4 4-4 4M19 12H10'/%3E%3C/svg%3E");
}

/* ---------------------------------------------------------
   Navigation
--------------------------------------------------------- */

.woocommerce-MyAccount-navigation {
  position: sticky;
  top: 100px;
  padding: 10px;
  background: var(--acc-surface);
  border: 1px solid var(--acc-line);
  border-radius: var(--acc-radius-m);
}

.woocommerce-MyAccount-navigation ul {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.woocommerce-MyAccount-navigation li {
  margin: 0;
}

.woocommerce-MyAccount-navigation a {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 8px 12px;
  border-radius: var(--acc-radius-s);
  color: var(--acc-ink);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.25;
  text-decoration: none;
  transition: background .16s ease, color .16s ease;
}

.woocommerce-MyAccount-navigation a::before {
  content: "";
  flex: none;
  width: 20px;
  height: 20px;
  background: currentColor;
  -webkit-mask: var(--icon) center / contain no-repeat;
  mask: var(--icon) center / contain no-repeat;
}

.woocommerce-MyAccount-navigation a:hover {
  background: var(--acc-tint);
  color: var(--acc-primary);
}

.woocommerce-MyAccount-navigation .is-active a,
.woocommerce-MyAccount-navigation .is-active a:hover {
  background: var(--acc-primary);
  color: #fff;
}

.woocommerce-MyAccount-navigation-link--customer-logout {
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--acc-line);
}

.woocommerce-MyAccount-navigation-link--customer-logout a {
  color: var(--acc-muted);
}

.woocommerce-MyAccount-navigation-link--customer-logout a:hover {
  background: transparent;
  color: var(--acc-danger);
}

/* ---------------------------------------------------------
   Type inside the content
--------------------------------------------------------- */

.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
  margin: 0 0 14px;
  color: var(--acc-primary);
  font-size: 24px;
  line-height: 1.2;
}

.woocommerce-MyAccount-content h3 {
  font-size: 18px;
}

.woocommerce-MyAccount-content p {
  margin: 0;
  font-size: 15px;
}

.woocommerce-MyAccount-content mark {
  background: none;
  color: var(--acc-ink);
  font-weight: 600;
}

/* ---------------------------------------------------------
   Buttons
--------------------------------------------------------- */

.lsb2b-account .woocommerce .button,
.lsb2b-account .woocommerce button[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 10px 26px;
  border: 1.5px solid transparent;
  border-radius: 100px;
  background: var(--acc-primary);
  color: #fff;
  font: inherit;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.15;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}

.lsb2b-account .woocommerce .button:hover,
.lsb2b-account .woocommerce button[type="submit"]:hover {
  background: var(--acc-primary-hover);
  transform: translateY(-1px);
}

/* Actions in a list are secondary to what is in the list. */
.lsb2b-account .woocommerce td .button,
.lsb2b-account .woocommerce .woocommerce-pagination .button {
  min-height: 38px;
  padding: 6px 16px;
  border-color: var(--acc-primary);
  background: transparent;
  color: var(--acc-primary);
  font-size: 14px;
  white-space: nowrap;
}

.lsb2b-account .woocommerce td .button:hover,
.lsb2b-account .woocommerce .woocommerce-pagination .button:hover {
  background: var(--acc-primary);
  color: #fff;
}

@media (pointer: coarse) {
  .lsb2b-account .woocommerce td .button {
    min-height: 44px;
  }
}

/* ---------------------------------------------------------
   Notices
--------------------------------------------------------- */

.lsb2b-account .woocommerce-message,
.lsb2b-account .woocommerce-info,
.lsb2b-account .woocommerce-error,
.lsb2b-account .woocommerce-notice {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 20px;
  margin: 0 0 var(--acc-gap);
  padding: 14px 20px;
  border: 1px solid var(--acc-line);
  border-radius: var(--acc-radius-s);
  background: var(--acc-surface);
  color: var(--acc-ink);
  font-size: 15px;
  line-height: 1.5;
  list-style: none;
}

.woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-MyAccount-content .woocommerce-info,
.woocommerce-MyAccount-content .woocommerce-error,
.woocommerce-MyAccount-content .woocommerce-notice {
  flex-wrap: nowrap;
  margin-bottom: 0;
}

/* WooCommerce prints the button before the text. */
.lsb2b-account .woocommerce-message .button,
.lsb2b-account .woocommerce-info .button,
.lsb2b-account .woocommerce-error .button {
  flex: none;
  order: 2;
  min-height: 40px;
  padding: 6px 20px;
  font-size: 14px;
}

.lsb2b-account .woocommerce-message {
  border-color: rgba(18, 116, 69, .28);
  background: #e9f6ef;
  color: #0e5a36;
}

.lsb2b-account .woocommerce-error {
  border-color: color-mix(in srgb, var(--acc-danger) 28%, transparent);
  background: #fbeeee;
  color: var(--acc-danger);
}

.lsb2b-account .woocommerce-error li {
  margin: 0;
}

/* ---------------------------------------------------------
   Status labels
--------------------------------------------------------- */

.lsb2b-status,
.woocommerce-MyAccount-content mark.order-status {
  display: inline-flex;
  align-items: center;
  padding: 3px 11px;
  border-radius: 100px;
  background: var(--acc-tint);
  color: var(--acc-primary);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  white-space: nowrap;
}

.lsb2b-status--completed {
  background: #e9f6ef;
  color: #0e5a36;
}

.lsb2b-status--on-hold,
.lsb2b-status--pending {
  background: #fff3d9;
  color: #7a5200;
}

.lsb2b-status--cancelled,
.lsb2b-status--failed {
  background: #fbeeee;
  color: #8f2e2e;
}

.lsb2b-status--refunded {
  background: #f0f0f2;
  color: #55555a;
}

/* ---------------------------------------------------------
   Tables: orders, order details, payment methods
--------------------------------------------------------- */

.woocommerce-MyAccount-content table {
  width: 100%;
  margin: 0;
  border: 1px solid var(--acc-line);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--acc-radius-m);
  background: var(--acc-surface);
  overflow: hidden;
}

.woocommerce-MyAccount-content thead th {
  padding: 14px 20px;
  border-bottom: 1px solid var(--acc-line);
  color: var(--acc-muted);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  text-align: left;
  text-transform: uppercase;
}

.woocommerce-MyAccount-content tbody th,
.woocommerce-MyAccount-content tbody td,
.woocommerce-MyAccount-content tfoot th,
.woocommerce-MyAccount-content tfoot td {
  padding: 16px 20px;
  border-bottom: 1px solid var(--acc-line);
  color: var(--acc-ink);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.45;
  text-align: left;
  vertical-align: middle;
}

.woocommerce-MyAccount-content table > :last-child > tr:last-child > * {
  border-bottom: 0;
}

.woocommerce-orders-table__cell-order-number a {
  font-weight: 600;
  text-decoration: none;
}

.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions,
.woocommerce-MyAccount-content .payment-method-actions {
  text-align: right;
}

/* Room for the usual two buttons side by side; a pending order has more, and those wrap. */
.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions {
  min-width: 232px;
}

.woocommerce-MyAccount-content thead .woocommerce-orders-table__header-order-actions {
  text-align: right;
}

.woocommerce-MyAccount-content .woocommerce-orders-table td .button {
  margin: 3px 0 3px 6px;
}

/* Order details */
.woocommerce-table--order-details .product-total,
.woocommerce-table--order-details tfoot td {
  text-align: right;
}

.woocommerce-MyAccount-content .woocommerce-table--order-details tfoot th {
  color: var(--acc-muted);
  font-weight: 500;
}

.woocommerce-table--order-details .product-quantity {
  font-weight: 600;
}

.woocommerce-table--order-details .wc-item-meta {
  margin: 6px 0 0;
  padding: 0;
  color: var(--acc-muted);
  font-size: 14px;
  list-style: none;
}

.woocommerce-table--order-details .wc-item-meta p,
.woocommerce-table--order-details .wc-item-meta strong {
  display: inline;
  font-size: inherit;
  font-weight: 400;
}

/* Below this width a row becomes a small card, label by label. */
@container lsb2b-content (max-width: 640px) {
  .woocommerce-MyAccount-content .woocommerce-message,
  .woocommerce-MyAccount-content .woocommerce-info,
  .woocommerce-MyAccount-content .woocommerce-error,
  .woocommerce-MyAccount-content .woocommerce-notice {
    flex-wrap: wrap;
  }

  .woocommerce-orders-table thead,
  .woocommerce-PaymentMethods thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }

  .woocommerce-orders-table,
  .woocommerce-orders-table tbody,
  .woocommerce-orders-table tr,
  .woocommerce-PaymentMethods,
  .woocommerce-PaymentMethods tbody,
  .woocommerce-PaymentMethods tr {
    display: block;
  }

  .woocommerce-MyAccount-content .woocommerce-orders-table tr,
  .woocommerce-MyAccount-content .woocommerce-PaymentMethods tr {
    padding: 8px 18px 14px;
    border-bottom: 1px solid var(--acc-line);
  }

  .woocommerce-MyAccount-content .woocommerce-orders-table tr:last-child,
  .woocommerce-MyAccount-content .woocommerce-PaymentMethods tr:last-child {
    border-bottom: 0;
  }

  .woocommerce-MyAccount-content .woocommerce-orders-table tr > *,
  .woocommerce-MyAccount-content .woocommerce-PaymentMethods tr > * {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 0;
    border: 0;
    text-align: right;
  }

  .woocommerce-orders-table tr > *::before,
  .woocommerce-PaymentMethods tr > *::before {
    content: attr(data-title);
    flex: none;
    color: var(--acc-muted);
    font-size: 13px;
    font-weight: 500;
    text-align: left;
  }

  .woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions,
  .woocommerce-MyAccount-content .payment-method-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
    padding-top: 12px;
  }

  .woocommerce-orders-table__cell-order-actions::before,
  .payment-method-actions::before {
    display: none;
  }

  /* Amount and "for 2 items" are separate flex items; they belong together. */
  .woocommerce-MyAccount-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-total {
    flex-wrap: wrap;
    gap: 4px;
  }

  .woocommerce-orders-table__cell-order-total::before {
    margin-right: auto;
  }

  .woocommerce-MyAccount-content .woocommerce-orders-table td .button {
    margin: 0;
  }

  .woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions {
    min-width: 0;
  }

  .woocommerce-orders-table__cell-order-actions .button {
    flex: 1 1 auto;
  }
}

.woocommerce-pagination {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* ---------------------------------------------------------
   Addresses
--------------------------------------------------------- */

.woocommerce-Addresses,
.woocommerce-customer-details .col2-set {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 20px;
}

.woocommerce-Address,
.woocommerce-customer-details address {
  padding: 24px;
  border: 1px solid var(--acc-line);
  border-radius: var(--acc-radius-m);
  background: var(--acc-surface);
}

.woocommerce-Address-title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 16px;
  margin-bottom: 14px;
}

.woocommerce-MyAccount-content .woocommerce-Address-title h2 {
  margin: 0;
  font-size: 22px;
}

.woocommerce-MyAccount-content .woocommerce-Address-title a {
  font-size: 14px;
  font-weight: 500;
}

.woocommerce-MyAccount-content address {
  color: var(--acc-ink);
  font-size: 15px;
  font-style: normal;
  line-height: 1.6;
}

.woocommerce-customer-details address p {
  margin-top: 8px;
}

/* ---------------------------------------------------------
   Forms
--------------------------------------------------------- */

.woocommerce-EditAccountForm,
.woocommerce-MyAccount-content .woocommerce-address-fields,
.woocommerce-MyAccount-content form#add_payment_method,
.lsb2b-account .woocommerce-form-login,
.lsb2b-account .woocommerce-form-register,
.lsb2b-account .woocommerce-ResetPassword {
  padding: clamp(20px, 3vw, 32px);
  border: 1px solid var(--acc-line);
  border-radius: var(--acc-radius-m);
  background: var(--acc-surface);
}

/* Rows flow next to each other when they are half width and there is room. */
.woocommerce-EditAccountForm,
.woocommerce-address-fields__field-wrapper,
.lsb2b-account .woocommerce-form-login,
.lsb2b-account .woocommerce-form-register,
.lsb2b-account .woocommerce-ResetPassword {
  display: flex;
  flex-wrap: wrap;
  gap: 18px 16px;
}

.woocommerce-EditAccountForm > *,
.woocommerce-address-fields__field-wrapper > *,
.lsb2b-account .woocommerce-form-login > *,
.lsb2b-account .woocommerce-form-register > *,
.lsb2b-account .woocommerce-ResetPassword > * {
  flex: 1 1 100%;
  min-width: 0;
  margin: 0;
}

.lsb2b-account .woocommerce .form-row-first,
.lsb2b-account .woocommerce .form-row-last {
  flex: 1 1 calc(50% - 8px);
  min-width: 190px;
}

.lsb2b-account .woocommerce form .clear {
  display: none;
}

.woocommerce-address-fields > p:last-child {
  margin: 24px 0 0;
}

.lsb2b-account .woocommerce .form-row {
  margin: 0;
}

.lsb2b-account .woocommerce label {
  display: block;
  margin: 0 0 7px;
  color: var(--acc-ink);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
}

.lsb2b-account .woocommerce .required {
  color: var(--acc-danger);
  text-decoration: none;
}

.lsb2b-account .woocommerce-input-wrapper {
  display: block;
}

.lsb2b-account .woocommerce input[type="text"],
.lsb2b-account .woocommerce input[type="email"],
.lsb2b-account .woocommerce input[type="tel"],
.lsb2b-account .woocommerce input[type="number"],
.lsb2b-account .woocommerce input[type="password"],
.lsb2b-account .woocommerce select,
.lsb2b-account .woocommerce textarea {
  width: 100%;
  height: 52px;
  padding: 0 16px;
  border: 1.5px solid var(--acc-line-strong);
  border-radius: var(--acc-radius-s);
  background-color: var(--acc-surface);
  color: var(--acc-ink);
  font: inherit;
  /* 16px is also the limit below which Safari on iOS zooms in. */
  font-size: 16px;
  transition: border-color .18s ease, box-shadow .18s ease;
}

.lsb2b-account .woocommerce textarea {
  height: auto;
  min-height: 120px;
  padding-block: 12px;
}

.lsb2b-account .woocommerce select {
  padding-right: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236e6e73' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  cursor: pointer;
  appearance: none;
}

.lsb2b-account .woocommerce input:focus,
.lsb2b-account .woocommerce select:focus,
.lsb2b-account .woocommerce textarea:focus {
  border-color: var(--acc-primary);
  outline: 0;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--acc-primary) 18%, transparent);
}

.lsb2b-account .woocommerce input[type="checkbox"],
.lsb2b-account .woocommerce input[type="radio"] {
  flex: none;
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: var(--acc-primary);
}

.lsb2b-account .woocommerce label:has(> input[type="checkbox"]),
.lsb2b-account .woocommerce label:has(> input[type="radio"]) {
  display: flex;
  gap: 10px;
  font-size: 14px;
  font-weight: 500;
}

.woocommerce-MyAccount-content em,
.woocommerce-form-register .woocommerce-privacy-policy-text p,
.lsb2b-register-note,
.woocommerce-form-register > p:not([class]) {
  color: var(--acc-muted);
  font-size: 13px;
  font-style: normal;
  line-height: 1.5;
}

.woocommerce-EditAccountForm fieldset {
  margin: 8px 0 0;
  padding: 22px 0 0;
  border: 0;
  border-top: 1px solid var(--acc-line);
}

.woocommerce-EditAccountForm legend {
  padding: 0 0 14px;
  float: left;
  width: 100%;
  color: var(--acc-primary);
  font-size: 18px;
  font-weight: 500;
}

.lsb2b-account .woocommerce .woocommerce-EditAccountForm fieldset .form-row {
  clear: both;
  margin-bottom: 18px;
}

.lsb2b-account .woocommerce .woocommerce-EditAccountForm fieldset .form-row:last-of-type {
  margin-bottom: 0;
}

/* Show password */
.lsb2b-account .password-input {
  position: relative;
  display: block;
}

.lsb2b-account .woocommerce input[type="password"],
.lsb2b-account .password-input input {
  padding-right: 52px;
}

.lsb2b-account .woocommerce .show-password-input {
  position: absolute;
  top: 50%;
  right: 6px;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--acc-muted);
  cursor: pointer;
  transform: translateY(-50%);
}

.lsb2b-account .show-password-input::before {
  content: "";
  width: 20px;
  height: 20px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12s3.300-6.500 9-6.500 9 6.500 9 6.500-3.300 6.500-9 6.500S3 12 3 12z'/%3E%3Ccircle cx='12' cy='12' r='2.800'/%3E%3Cpath d='M4 4l16 16'/%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='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12s3.300-6.500 9-6.500 9 6.500 9 6.500-3.300 6.500-9 6.500S3 12 3 12z'/%3E%3Ccircle cx='12' cy='12' r='2.800'/%3E%3Cpath d='M4 4l16 16'/%3E%3C/svg%3E") center / contain no-repeat;
}

.lsb2b-account .show-password-input.display-password::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12s3.300-6.500 9-6.500 9 6.500 9 6.500-3.300 6.500-9 6.500S3 12 3 12z'/%3E%3Ccircle cx='12' cy='12' r='2.800'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12s3.300-6.500 9-6.500 9 6.500 9 6.500-3.300 6.500-9 6.500S3 12 3 12z'/%3E%3Ccircle cx='12' cy='12' r='2.800'/%3E%3C/svg%3E");
}

.lsb2b-account .woocommerce-password-strength {
  margin-top: 8px;
  padding: 6px 12px;
  border-radius: 8px;
  background: var(--acc-tint);
  font-size: 13px;
}

.lsb2b-account .woocommerce-password-hint {
  display: block;
  margin-top: 6px;
  color: var(--acc-muted);
  font-size: 13px;
}

/* Country and state dropdowns */
.lsb2b-account .select2-container--default .select2-selection--single {
  display: flex;
  align-items: center;
  height: 52px;
  border: 1.5px solid var(--acc-line-strong);
  border-radius: var(--acc-radius-s);
  background: var(--acc-surface);
}

.lsb2b-account .select2-container--default.select2-container--focus .select2-selection--single,
.lsb2b-account .select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--acc-primary);
}

.lsb2b-account .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 0 40px 0 16px;
  color: var(--acc-ink);
  font-size: 16px;
  line-height: 1.3;
}

.lsb2b-account .select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 0;
  right: 10px;
  height: 100%;
}

.lsb2b-account .select2-dropdown {
  overflow: hidden;
  border: 1.5px solid var(--acc-line-strong);
  border-radius: var(--acc-radius-s);
}

.lsb2b-account .select2-container--default .select2-results__option--highlighted[aria-selected],
.lsb2b-account .select2-container--default .select2-results__option--highlighted[data-selected] {
  background: var(--acc-primary);
}

/* ---------------------------------------------------------
   Login and registration
--------------------------------------------------------- */

.lsb2b-tabbar {
  display: flex;
  gap: 4px;
  margin: 0 0 16px;
  padding: 4px;
  border: 1px solid var(--acc-line);
  border-radius: 100px;
  background: var(--acc-surface);
}

.lsb2b-account .woocommerce .lsb2b-tab {
  flex: 1;
  min-height: 44px;
  padding: 8px 16px;
  border: 0;
  border-radius: 100px;
  background: transparent;
  color: var(--acc-muted);
  font: inherit;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  transition: background .18s ease, color .18s ease;
}

.lsb2b-account .woocommerce .lsb2b-tab:hover {
  color: var(--acc-primary);
}

.lsb2b-account .woocommerce .lsb2b-tab[aria-selected="true"] {
  background: var(--acc-primary);
  color: #fff;
}

/* One panel at a time. Its heading goes too: the tabs already say it. */
.lsb2b-tabs.is-login .u-column2,
.lsb2b-tabs.is-register .u-column1,
.lsb2b-tabs > .u-column1 > h2,
.lsb2b-tabs > .u-column2 > h2 {
  display: none;
}

.lsb2b-account .woocommerce-form button[type="submit"] {
  width: 100%;
  min-height: 52px;
  margin-top: 4px;
}

.lsb2b-account .woocommerce-form-login .form-row:has(button[type="submit"]) label {
  margin-bottom: 14px;
}

.lsb2b-account .woocommerce-LostPassword {
  font-size: 14px;
  text-align: center;
}

.lsb2b-register-note {
  margin: 0;
}

.lsb2b-field-error {
  display: block;
  margin-top: 6px;
  color: var(--acc-danger);
  font-size: 13px;
  line-height: 1.4;
}

.lsb2b-field-error:empty {
  display: none;
}

.lsb2b-account .woocommerce input.has-error,
.lsb2b-account .woocommerce select.has-error,
.lsb2b-account .woocommerce textarea.has-error {
  border-color: var(--acc-danger);
}

/* A quiet tick once a required field is right. Not on the password field: the show-password button sits there. */
.lsb2b-account .woocommerce input.is-valid:not([type="password"]) {
  padding-right: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%231F8A5B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
}

/* ---------------------------------------------------------
   Dashboard: greeting
--------------------------------------------------------- */

.lsb2b-panel {
  position: relative;
  display: flex;
  min-height: 248px;
  overflow: hidden;
  padding: clamp(28px, 4vw, 44px);
  border-radius: var(--acc-radius-l);
  background: var(--acc-primary);
  isolation: isolate;
}

.lsb2b-panel__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  max-width: 56%;
}

.woocommerce-MyAccount-content .lsb2b-panel__eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.lsb2b-panel__eyebrow::before {
  content: "";
  width: 24px;
  height: 2px;
  background: var(--acc-accent);
}

.woocommerce-MyAccount-content .lsb2b-panel__title {
  margin: 0;
  color: #fff;
  font-size: clamp(34px, 5cqi, 48px);
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.woocommerce-MyAccount-content .lsb2b-panel__line {
  margin-top: 10px;
  color: rgba(255, 255, 255, .86);
  font-size: 15px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.lsb2b-panel__button {
  display: inline-flex;
  align-items: center;
  min-height: 46px;
  margin-top: 22px;
  padding: 10px 24px;
  border-radius: 100px;
  background: var(--acc-on-panel);
  color: var(--acc-primary);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.15;
  text-decoration: none;
  transition: background .18s ease, transform .18s ease;
}

.lsb2b-panel__button:hover {
  background: #fff;
  color: var(--acc-primary);
  transform: translateY(-1px);
}

.lsb2b-account .woocommerce .lsb2b-panel__button:focus-visible {
  outline-color: #fff;
}

.lsb2b-panel__art {
  position: absolute;
  z-index: -1;
  top: 50%;
  right: -9%;
  width: 62%;
  transform: translateY(-50%);
}

.lsb2b-panel__art svg {
  display: block;
  width: 100%;
  height: auto;
}

/* ---------------------------------------------------------
   Dashboard: recent orders
--------------------------------------------------------- */

.lsb2b-recent {
  border: 1px solid var(--acc-line);
  border-radius: var(--acc-radius-m);
  background: var(--acc-surface);
  overflow: hidden;
}

.lsb2b-recent__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 16px;
  padding: 20px 24px 14px;
}

.woocommerce-MyAccount-content .lsb2b-recent__title {
  margin: 0;
}

.lsb2b-recent__all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--acc-primary);
  font-size: 14px;
  font-weight: 500;
  text-underline-offset: 3px;
}

.lsb2b-recent__all::after {
  content: "\2192";
}

.lsb2b-recent__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.lsb2b-recent__list li {
  margin: 0;
  border-top: 1px solid var(--acc-line);
}

.lsb2b-order {
  display: grid;
  grid-template-columns: minmax(64px, auto) minmax(0, 1fr) auto minmax(96px, auto);
  align-items: center;
  gap: 8px 20px;
  min-height: 60px;
  padding: 10px 24px;
  color: var(--acc-ink);
  font-size: 15px;
  text-decoration: none;
  transition: background .16s ease;
}

.lsb2b-order:hover {
  background: var(--acc-tint);
}

.lsb2b-order__number {
  color: var(--acc-primary);
  font-weight: 600;
}

.lsb2b-order__date {
  color: var(--acc-muted);
}

.lsb2b-order__total {
  font-weight: 600;
  text-align: right;
  white-space: nowrap;
}

.woocommerce-MyAccount-content .lsb2b-recent__empty {
  padding: 4px 24px 22px;
  color: var(--acc-muted);
}

/* ---------------------------------------------------------
   Dashboard: shortcuts
--------------------------------------------------------- */

.lsb2b-shortcuts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
  gap: 16px;
}

.lsb2b-shortcut {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--acc-line);
  border-radius: var(--acc-radius-m);
  background: var(--acc-surface);
  color: var(--acc-ink);
  text-decoration: none;
  transition: border-color .18s ease, transform .18s ease;
}

.lsb2b-shortcut::before {
  content: "";
  width: 22px;
  height: 22px;
  margin-bottom: 12px;
  background: var(--acc-accent);
  -webkit-mask: var(--icon) center / contain no-repeat;
  mask: var(--icon) center / contain no-repeat;
}

.lsb2b-shortcut:hover {
  border-color: var(--acc-primary);
  transform: translateY(-2px);
}

.lsb2b-shortcut__label {
  color: var(--acc-primary);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
}

.lsb2b-shortcut__summary {
  color: var(--acc-muted);
  font-size: 14px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

/* ---------------------------------------------------------
   Narrow
--------------------------------------------------------- */

@container lsb2b-content (max-width: 560px) {
  .lsb2b-panel {
    min-height: 0;
    padding-bottom: 104px;
  }

  .lsb2b-panel__body {
    max-width: none;
  }

  .lsb2b-panel__art {
    top: auto;
    right: -8%;
    bottom: -44px;
    width: 280px;
    transform: none;
  }

  .lsb2b-order {
    grid-template-columns: minmax(0, 1fr) auto;
    padding-block: 14px;
  }

  .lsb2b-order .lsb2b-status {
    grid-row: 2;
    grid-column: 1;
    justify-self: start;
  }

  .lsb2b-order__total {
    grid-row: 2;
    grid-column: 2;
  }

  .lsb2b-order__date {
    text-align: right;
  }
}

@media (max-width: 860px) {
  .lsb2b-account.logged-in .woocommerce {
    grid-template-columns: minmax(0, 1fr);
  }

  .lsb2b-account.logged-in .woocommerce > .woocommerce-MyAccount-navigation,
  .lsb2b-account.logged-in .woocommerce > .woocommerce-MyAccount-content {
    grid-column: 1;
  }

  .woocommerce-MyAccount-navigation {
    position: static;
    padding: 0;
    border: 0;
    background: transparent;
  }

  .woocommerce-MyAccount-navigation ul {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
  }

  .woocommerce-MyAccount-navigation a {
    gap: 8px;
    padding: 8px 14px 8px 12px;
    border: 1px solid var(--acc-line);
    border-radius: 100px;
    background: var(--acc-surface);
    font-size: 14px;
  }

  .woocommerce-MyAccount-navigation a::before {
    width: 18px;
    height: 18px;
  }

  .woocommerce-MyAccount-navigation .is-active a {
    border-color: var(--acc-primary);
  }

  .woocommerce-MyAccount-navigation-link--customer-logout {
    margin: 0;
    padding: 0;
    border: 0;
  }

  .woocommerce-MyAccount-navigation-link--customer-logout a:hover {
    background: var(--acc-surface);
  }
}

@media (prefers-reduced-motion: reduce) {
  .lsb2b-account .woocommerce *,
  .lsb2b-account .woocommerce *::before {
    transition: none !important;
  }

  .lsb2b-account .woocommerce .button:hover,
  .lsb2b-account .woocommerce button[type="submit"]:hover,
  .lsb2b-panel__button:hover,
  .lsb2b-shortcut:hover {
    transform: none;
  }
}