/* ============================================================
   Collore — Minha Conta
   Menu lateral em cartão com ícones, conteúdo em cartão,
   tipografia e cores da marca.
   ============================================================ */

.woocommerce-account .woocommerce {
  --clre-texto: var(--col-text, #1a1a1a);
  --clre-suave: var(--col-muted, #8a8a8a);
  --clre-borda: var(--col-border, #ececec);
  --clre-acento: var(--col-accent, #5b5e3f);
  --clre-dourado: var(--col-accent-2, #c9a24b);
  --clre-fundo: #faf9f7;
  --clre-raio: var(--col-radius, 14px);
  --clre-raio-sm: var(--col-radius-sm, 10px);
}

/* ---------- 1. Duas colunas ----------
   🔴 Só com sessão aberta. Deslogado não existe menu lateral: o único filho é o
   par entrar/cadastrar, que caía na coluna de 260px e virava duas colunas de
   125px, uma palavra por linha. A visita deslogada é tratada na seção 8. */
@media (min-width: 861px) {
  /* duas condições pro mesmo caso: a classe do WordPress vale em qualquer
     navegador, o :has() vale mesmo se um dia a classe sumir do body */
  .woocommerce-account.logged-in .woocommerce,
  .woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
  }

  /* colunas explícitas: sem isso a ordem automática do grid trocou
     o menu e o conteúdo de lugar */
  .woocommerce-account .woocommerce-MyAccount-navigation {
    grid-column: 1;
    grid-row: 1;
  }

  .woocommerce-account .woocommerce-MyAccount-content {
    grid-column: 2;
    grid-row: 1;
  }

  .woocommerce-account .woocommerce-notices-wrapper {
    grid-column: 1 / -1;
  }
}

.woocommerce-account .woocommerce-MyAccount-navigation {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

.woocommerce-account .woocommerce-MyAccount-content {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  min-width: 0;
  background: #fff;
  border: 1px solid var(--clre-borda);
  border-radius: var(--clre-raio);
  padding: 28px;
}

/* ---------- 2. Menu lateral ---------- */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 8px !important;
  background: #fff;
  border: 1px solid var(--clre-borda);
  border-radius: var(--clre-raio);
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li::marker,
.woocommerce-account .woocommerce-MyAccount-navigation li::before {
  content: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 12px 14px;
  border-radius: var(--clre-raio-sm);
  color: var(--clre-texto) !important;
  font-size: .95rem;
  font-weight: 600;
  text-decoration: none !important;
  transition: background-color .15s ease, color .15s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
  background: var(--clre-fundo);
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  background: var(--clre-acento);
  color: #fff !important;
}

/* ícone antes do texto, por endpoint */
.woocommerce-account .woocommerce-MyAccount-navigation li a::before {
  content: "";
  flex: none;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  opacity: .75;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a::before {
  opacity: 1;
  filter: brightness(0) invert(1);
}

.woocommerce-MyAccount-navigation-link--dashboard a::before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--orders a::before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2h12l1 5H5z'/%3E%3Cpath d='M5 7v13a1 1 0 001 1h12a1 1 0 001-1V7'/%3E%3Cpath d='M9 11h6'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--edit-address a::before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-5.3 7-11a7 7 0 10-14 0c0 5.7 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--edit-account a::before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20c0-3.3 3.1-5.5 7-5.5s7 2.2 7 5.5'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--wallet-pagarme a::before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='5.5' width='19' height='13' rx='2'/%3E%3Cpath d='M2.5 10h19'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--customer-logout a::before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1a1a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 17l5-5-5-5'/%3E%3Cpath d='M20 12H9'/%3E%3Cpath d='M12 3H5a1 1 0 00-1 1v16a1 1 0 001 1h7'/%3E%3C/svg%3E");
}

/* sair fica separado do resto */
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout {
  margin-top: 6px !important;
  padding-top: 6px !important;
  border-top: 1px solid var(--clre-borda);
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a {
  color: var(--clre-suave) !important;
  font-weight: 500;
}

/* ---------- 3. Painel ---------- */
.clre-conta__ola {
  margin: 0 0 6px;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--clre-texto);
}

.clre-conta__sub {
  margin: 0 0 24px;
  font-size: .95rem;
  line-height: 1.6;
  color: var(--clre-suave);
}

.clre-conta__cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px;
}

.clre-card {
  display: block;
  padding: 20px;
  border: 1px solid var(--clre-borda);
  border-radius: var(--clre-raio-sm);
  background: #fff;
  text-decoration: none !important;
  transition: border-color .15s ease, transform .06s ease, box-shadow .15s ease;
}

.clre-card:hover {
  border-color: var(--clre-acento);
  box-shadow: 0 6px 18px rgba(91, 94, 63, .08);
}

.clre-card:active {
  transform: translateY(1px);
}

.clre-card__titulo {
  display: block;
  margin-bottom: 4px;
  font-size: 1rem;
  font-weight: 700;
  color: var(--clre-texto);
}

.clre-card__texto {
  display: block;
  font-size: .85rem;
  line-height: 1.5;
  color: var(--clre-suave);
}

.clre-conta__rodape {
  margin: 24px 0 0;
  padding-top: 18px;
  border-top: 1px solid var(--clre-borda);
  font-size: .88rem;
  color: var(--clre-suave);
}

.clre-conta__rodape a {
  color: var(--clre-acento);
  font-weight: 600;
}

/* ---------- 4. Tabelas (pedidos, endereços) ---------- */
.woocommerce-account .woocommerce-MyAccount-content table.shop_table {
  width: 100%;
  border: 1px solid var(--clre-borda) !important;
  border-radius: var(--clre-raio-sm);
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  margin: 0;
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table thead th {
  background: var(--clre-fundo);
  border: 0 !important;
  border-bottom: 1px solid var(--clre-borda) !important;
  padding: 12px 16px !important;
  font-size: .74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--clre-suave);
  text-align: left;
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table tbody td {
  border: 0 !important;
  border-bottom: 1px solid #f5f5f3 !important;
  padding: 14px 16px !important;
  font-size: .92rem;
  color: var(--clre-texto);
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table tbody tr:last-child td {
  border-bottom: 0 !important;
}

.woocommerce-account .woocommerce-orders-table__cell-order-status {
  font-weight: 600;
}

/* ---------- 4b. Ações do pedido ----------
   Os três saíam colados e com alturas diferentes (Pagar e Cancelar com o padding
   do botão grande, Visualizar com o do secundário), então pareciam sobrepostos e
   a quebra de linha jogava o Cancelar por cima da linha de cima. Agora é uma
   pilha com respiro, todos da mesma altura, e com peso por importância. */

.woocommerce-account .woocommerce-orders-table__cell-order-actions {
  white-space: normal;
}

.woocommerce-account .woocommerce-orders-table__cell-order-actions .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  margin: 0 6px 6px 0 !important;
  padding: 8px 16px !important;
  font-size: .85rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  white-space: nowrap;
}

/* no desktop a coluna é estreita: viram uma pilha da largura da coluna */
@media (min-width: 861px) {
  .woocommerce-account .woocommerce-orders-table__cell-order-actions .button {
    display: flex;
    width: 100%;
    margin: 0 0 6px !important;
  }

  .woocommerce-account .woocommerce-orders-table__cell-order-actions .button:last-child {
    margin-bottom: 0 !important;
  }
}

/* o cheio não tem borda e ficava 2px mais baixo que os dois com contorno */
.woocommerce-account .woocommerce-orders-table .button.pay {
  border: 1px solid transparent !important;
}

/* cancelar é destrutivo: não pode ter o mesmo peso visual de "Pagar", senão o
   dedo erra. Fica discreto e só assume o vermelho quando a pessoa mira nele. */
.woocommerce-account .woocommerce-orders-table .button.cancel {
  background: transparent !important;
  color: var(--clre-suave) !important;
  border: 1px solid var(--clre-borda) !important;
  font-weight: 500 !important;
}

.woocommerce-account .woocommerce-orders-table .button.cancel:hover {
  filter: none;
  color: #b03a2e !important;
  background: rgba(176, 58, 46, .06) !important;
  border-color: rgba(176, 58, 46, .4) !important;
}

/* ---------- 5. Formulários ---------- */
.woocommerce-account .woocommerce-MyAccount-content form .form-row {
  padding: 0 !important;
  margin: 0 0 14px !important;
}

.woocommerce-account .woocommerce-MyAccount-content label {
  display: block;
  font-size: .82rem;
  font-weight: 600;
  color: var(--clre-suave);
  margin-bottom: 6px;
}

.woocommerce-account .woocommerce-MyAccount-content input.input-text,
.woocommerce-account .woocommerce-MyAccount-content input[type="text"],
.woocommerce-account .woocommerce-MyAccount-content input[type="email"],
.woocommerce-account .woocommerce-MyAccount-content input[type="password"],
.woocommerce-account .woocommerce-MyAccount-content input[type="tel"],
.woocommerce-account .woocommerce-MyAccount-content select,
.woocommerce-account .woocommerce-MyAccount-content textarea {
  width: 100%;
  box-sizing: border-box;
  min-height: 46px;
  padding: 11px 14px !important;
  border: 1px solid var(--clre-borda) !important;
  border-radius: var(--clre-raio-sm) !important;
  font-family: inherit;
  font-size: .95rem;
  color: var(--clre-texto);
  background: #fff;
  transition: border-color .15s ease, box-shadow .15s ease;
}

.woocommerce-account .woocommerce-MyAccount-content input:focus,
.woocommerce-account .woocommerce-MyAccount-content select:focus,
.woocommerce-account .woocommerce-MyAccount-content textarea:focus {
  outline: none;
  border-color: var(--clre-acento) !important;
  box-shadow: 0 0 0 3px rgba(91, 94, 63, .12);
}

.woocommerce-account .woocommerce-MyAccount-content fieldset {
  border: 1px solid var(--clre-borda);
  border-radius: var(--clre-raio-sm);
  padding: 18px;
  margin: 22px 0 18px;
}

.woocommerce-account .woocommerce-MyAccount-content legend {
  padding: 0 8px;
  font-size: .9rem;
  font-weight: 700;
  color: var(--clre-texto);
}

/* ---------- 6. Botões ---------- */
.woocommerce-account .woocommerce-MyAccount-content .button,
.woocommerce-account .woocommerce-MyAccount-content button[type="submit"] {
  background: var(--clre-acento) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: var(--clre-raio-sm) !important;
  padding: 13px 24px !important;
  font-family: inherit;
  font-size: .95rem;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer;
  transition: filter .15s ease;
}

.woocommerce-account .woocommerce-MyAccount-content .button:hover,
.woocommerce-account .woocommerce-MyAccount-content button[type="submit"]:hover {
  filter: brightness(.92);
}

/* botão de "ver pedido" é secundário (tamanho vem da seção 4b) */
.woocommerce-account .woocommerce-orders-table .button.view {
  background: transparent !important;
  color: var(--clre-acento) !important;
  border: 1px solid var(--clre-acento) !important;
}

.woocommerce-account .woocommerce-orders-table .button.view:hover {
  filter: none;
  background: var(--clre-fundo) !important;
}

/* ---------- 7. Endereços ---------- */
.woocommerce-account .woocommerce-Addresses {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
}

.woocommerce-account .woocommerce-Address {
  width: auto !important;
  float: none !important;
  border: 1px solid var(--clre-borda);
  border-radius: var(--clre-raio-sm);
  padding: 20px;
}

.woocommerce-account .woocommerce-Address-title h2,
.woocommerce-account .woocommerce-Address-title h3 {
  font-size: 1rem !important;
  font-weight: 700 !important;
  margin: 0 0 10px !important;
}

.woocommerce-account .woocommerce-Address address {
  font-style: normal;
  font-size: .9rem;
  line-height: 1.6;
  color: var(--clre-suave);
}

/* ---------- 8. Deslogado: entrar e cadastrar ----------
   O WooCommerce entrega esse par em duas colunas flutuantes de 48%, que não
   colapsam no celular e não herdam nada da marca. Aqui viram dois cartões
   centrados, lado a lado no desktop e empilhados no celular. */

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

.woocommerce-account #customer_login {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  align-items: start;
}

@media (min-width: 861px) {
  .woocommerce-account #customer_login {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }
}

/* 🔴 O WooCommerce põe um clearfix `::before`/`::after` no .col2-set. Dentro de
   um grid esses dois viram ITENS: o ::before tomava a primeira célula e jogava
   entrar pra direita e cadastrar pra linha de baixo, na diagonal. */
.woocommerce-account #customer_login::before,
.woocommerce-account #customer_login::after {
  content: none !important;
  display: none !important;
}

.woocommerce-account #customer_login > div {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  background: #fff;
  border: 1px solid var(--clre-borda);
  border-radius: var(--clre-raio);
  padding: 26px 24px;
}

.woocommerce-account #customer_login h2 {
  margin: 0 0 18px !important;
  padding: 0 !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  line-height: 1.25;
  color: var(--clre-texto);
}

/* o cartão já é a moldura: o formulário dentro dele não precisa de outra */
.woocommerce-account #customer_login form.login,
.woocommerce-account #customer_login form.register {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
}

.woocommerce-account #customer_login .form-row {
  padding: 0 !important;
  margin: 0 0 16px !important;
}

.woocommerce-account #customer_login label,
.woocommerce-account form.lost_reset_password label {
  display: block;
  margin-bottom: 6px;
  font-size: .82rem;
  font-weight: 600;
  color: var(--clre-suave);
}

.woocommerce-account #customer_login input.input-text,
.woocommerce-account #customer_login input[type="text"],
.woocommerce-account #customer_login input[type="email"],
.woocommerce-account #customer_login input[type="password"],
.woocommerce-account form.lost_reset_password input.input-text {
  width: 100%;
  box-sizing: border-box;
  min-height: 46px;
  padding: 11px 14px !important;
  border: 1px solid var(--clre-borda) !important;
  border-radius: var(--clre-raio-sm) !important;
  font-family: inherit;
  font-size: .95rem;
  color: var(--clre-texto);
  background: #fff;
  transition: border-color .15s ease, box-shadow .15s ease;
}

.woocommerce-account #customer_login input:focus,
.woocommerce-account form.lost_reset_password input:focus {
  outline: none;
  border-color: var(--clre-acento) !important;
  box-shadow: 0 0 0 3px rgba(91, 94, 63, .12);
}

/* o olho de "mostrar senha" fica dentro do campo, não numa caixinha ao lado */
.woocommerce-account #customer_login .password-input {
  display: block;
  position: relative;
}

.woocommerce-account #customer_login .password-input input {
  padding-right: 44px !important;
}

.woocommerce-account #customer_login .show-password-input {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  padding: 0;
  border: 0;
  background: none;
  color: var(--clre-suave);
  cursor: pointer;
}

/* "Lembre-me" vira uma linha só, com o botão logo abaixo ocupando o cartão */
.woocommerce-account #customer_login .woocommerce-form-login__rememberme {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: .9rem;
  font-weight: 500;
  color: var(--clre-texto);
  cursor: pointer;
}

.woocommerce-account #customer_login .woocommerce-form-login__rememberme input {
  width: auto;
  min-height: 0;
  margin: 0;
  accent-color: var(--clre-acento);
}

.woocommerce-account #customer_login .form-row:not(.form-row-wide) {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: stretch;
}

.woocommerce-account #customer_login .button,
.woocommerce-account #customer_login button[type="submit"] {
  width: 100%;
  background: var(--clre-acento) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: var(--clre-raio-sm) !important;
  padding: 13px 24px !important;
  font-family: inherit;
  font-size: .95rem;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer;
  transition: filter .15s ease;
}

.woocommerce-account #customer_login .button:hover,
.woocommerce-account #customer_login button[type="submit"]:hover {
  filter: brightness(.92);
}

.woocommerce-account #customer_login .lost_password {
  margin: 16px 0 0 !important;
  font-size: .88rem;
}

.woocommerce-account #customer_login .lost_password a {
  color: var(--clre-acento) !important;
  font-weight: 600;
  text-decoration: none;
}

.woocommerce-account #customer_login .lost_password a:hover {
  text-decoration: underline;
}

/* explicação do link de senha e aviso de privacidade: apoio, não conteúdo */
.woocommerce-account #customer_login form.register > p,
.woocommerce-account #customer_login .woocommerce-privacy-policy-text p {
  margin: 0 0 16px;
  font-size: .86rem;
  line-height: 1.55;
  color: var(--clre-suave);
}

.woocommerce-account #customer_login .woocommerce-privacy-policy-link {
  color: var(--clre-acento) !important;
  text-decoration: underline;
}

/* recuperação de senha, que sai do "Perdeu sua senha?" */
.woocommerce-account form.lost_reset_password {
  max-width: 460px;
  margin: 0 auto !important;
  padding: 26px 24px !important;
  background: #fff;
  border: 1px solid var(--clre-borda) !important;
  border-radius: var(--clre-raio) !important;
}

.woocommerce-account form.lost_reset_password .button {
  width: 100%;
  background: var(--clre-acento) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: var(--clre-raio-sm) !important;
  padding: 13px 24px !important;
  font-weight: 700 !important;
}

/* ---------- 9. Telas pequenas ---------- */
@media (max-width: 860px) {
  .woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }

  .woocommerce-account .woocommerce-MyAccount-navigation li a {
    padding: 10px 12px;
    font-size: .88rem;
  }

  .woocommerce-account .woocommerce-MyAccount-content {
    margin-top: 16px !important;
    padding: 20px 16px;
  }
}

/* Abaixo de 768 o WooCommerce empilha a tabela: cada célula vira bloco, com o
   rótulo num ::before flutuando à esquerda. Aí dá pra usar flex sem mexer no
   modelo de tabela, e é o que põe o rótulo de um lado e os botões do outro. */
@media (max-width: 768px) {
  .woocommerce-account .woocommerce-orders-table__cell-order-actions {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
  }

  .woocommerce-account .woocommerce-orders-table__cell-order-actions::before {
    float: none !important;
    margin-right: auto;
  }

  .woocommerce-account .woocommerce-orders-table__cell-order-actions .button {
    margin: 0 !important;
  }

  /* aviso do WooCommerce: o botão vem flutuando à direita e caía por cima do
     texto na largura do celular */
  .woocommerce-account .woocommerce-message,
  .woocommerce-account .woocommerce-info,
  .woocommerce-account .woocommerce-error {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  /* o WooCommerce põe o botão ANTES do texto no HTML. Como o texto é um nó solto,
     ele é um item anônimo de ordem 0: basta mandar o botão pra ordem 1 pra ler
     primeiro o aviso e só depois a ação. */
  .woocommerce-account .woocommerce-message .button,
  .woocommerce-account .woocommerce-info .button,
  .woocommerce-account .woocommerce-error .button {
    order: 1;
    float: none !important;
    margin: 0 !important;
  }
}