.cg-preview-account main {
  --cg-account-red: var(--wp--preset--color--warm-red);
  --cg-account-gold: var(--wp--preset--color--golden-yellow);
  --cg-account-tint: var(--wp--preset--color--pale-yellow);
  overflow-wrap: anywhere;
}

.cg-preview-account main :is(.woocommerce-MyAccount-navigation, .woocommerce-MyAccount-content, form.woocommerce-form) {
  box-sizing: border-box;
  min-inline-size: 0;
  border: 1px solid var(--cg-border);
  border-radius: .65rem;
  padding: clamp(.85rem, 2.5vw, 1.5rem);
  background: var(--wp--preset--color--white-canvas);
}

.cg-preview-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}

.cg-preview-account .woocommerce-MyAccount-navigation li {
  flex: 1 1 8rem;
}

.cg-preview-account .woocommerce-MyAccount-navigation a {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  min-block-size: 2.75rem;
  padding: .45rem .65rem;
  border-radius: .35rem;
  color: var(--cg-account-red);
  font-weight: 650;
  text-decoration: none;
}

.cg-preview-account .woocommerce-MyAccount-navigation :is(.is-active a, a:hover) {
  background: var(--cg-account-tint);
}

.cg-preview-account main .woocommerce :is(a.button, button.button) {
  min-block-size: 2.75rem;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: .4rem;
  padding: .55rem .85rem;
  background: var(--cg-account-red);
  color: #fff;
  line-height: 1.35;
  font-weight: 700;
  text-decoration: none;
}

.cg-preview-account main .woocommerce :is(a.button, button.button):hover {
  background: #832320;
  color: #fff;
}

.cg-preview-account main .woocommerce :is(input[type="password"], input[type="email"], input[type="tel"]) {
  box-sizing: border-box;
  min-block-size: 2.75rem;
  max-inline-size: 100%;
  font: inherit;
}

.cg-preview-account main :is(.cg-delivery-summary, .cg-delivery-status) {
  border: 1px solid var(--cg-account-gold);
  border-inline-start-width: .35rem;
  border-radius: .5rem;
  background: var(--cg-account-tint);
  padding: .85rem 1rem;
  line-height: 1.65;
}

.cg-preview-account main :is(.cg-delivery-summary, .cg-delivery-status) strong {
  color: var(--cg-account-red);
}

@media (max-width: 760px) {
  .cg-preview-account .woocommerce :is(.woocommerce-MyAccount-navigation, .woocommerce-MyAccount-content) {
    float: none;
    inline-size: 100%;
  }

  .cg-preview-account .woocommerce-MyAccount-navigation {
    margin-block-end: 1rem;
  }
}
