/* ==========================================================================
   FITOTERAPIA CAMPOS - MI CUENTA
   Archivo: wp-content/themes/divi-child/fc-mi-cuenta.css
   Se carga solo en las paginas de cuenta, desde functions.php.

   Tokens: fondo F2F1EC, tarjeta FFFFFF, borde DDE2E2, texto 26313C,
   titulos 2A3B4D, apagado 5A7088, pizarra 3E556C, verde 5E7A4E
   ========================================================================== */

:root {
  --fc-bg:     #F2F1EC;
  --fc-card:   #FFFFFF;
  --fc-line:   #DDE2E2;
  --fc-text:   #26313C;
  --fc-head:   #2A3B4D;
  --fc-muted:  #5A7088;
  --fc-slate:  #3E556C;
  --fc-green:  #5E7A4E;
  --fc-gold:   #A67C34;
}


/* --------------------------------------------------------------------------
   1. FONDO DE LA PAGINA
   -------------------------------------------------------------------------- */

body.woocommerce-account,
body.woocommerce-account #page-container,
body.woocommerce-account #et-main-area,
body.woocommerce-account #main-content,
body.woocommerce-account article.page,
body.woocommerce-account .entry-content,
body.woocommerce-account #main-content .et_pb_section,
body.woocommerce-account #main-content .et_pb_row {
  background-color: var(--fc-bg) !important;
  background-image: none !important;
}


/* --------------------------------------------------------------------------
   2. REJILLA: navegacion + contenido
   Solo en escritorio. En telefono todo queda en una columna sin anular nada.
   -------------------------------------------------------------------------- */

body.logged-in.woocommerce-account #main-content .woocommerce {
  max-width: 1120px;
  margin: 0 auto !important;
}

@media (min-width: 981px) {

  body.logged-in.woocommerce-account #main-content .woocommerce {
    display: grid !important;
    grid-template-columns: 248px minmax(0, 1fr);
    gap: 24px;
    align-items: start !important;
  }

  /* El clearfix de Divi y Woo rompe el grid */
  body.logged-in.woocommerce-account #main-content .woocommerce::before,
  body.logged-in.woocommerce-account #main-content .woocommerce::after {
    display: none !important;
  }

  /* Sticky: 113 px del encabezado fijo + 20 de aire */
  body.logged-in.woocommerce-account .woocommerce-MyAccount-navigation {
    position: sticky !important;
    top: 133px !important;
    align-self: start !important;
  }
}


/* --------------------------------------------------------------------------
   3. TARJETA DE NAVEGACION
   -------------------------------------------------------------------------- */

.woocommerce-MyAccount-navigation {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  background: var(--fc-card);
  border: 1px solid var(--fc-line);
  border-radius: 18px;
  padding: 14px;
}

.fc-acct-navtitle {
  font: 700 11px/1 'Mulish', sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--fc-muted);
  padding: 6px 12px 14px;
}

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

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

.woocommerce-MyAccount-navigation ul li a {
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border-radius: 12px;
  font: 600 14px/1.2 'Mulish', sans-serif;
  color: var(--fc-slate) !important;
  text-decoration: none !important;
  transition: background .18s ease, color .18s ease;
}

.woocommerce-MyAccount-navigation ul li a:hover {
  background: var(--fc-bg);
  color: var(--fc-green) !important;
}

.woocommerce-MyAccount-navigation ul li.is-active a {
  background: var(--fc-slate);
  color: #FFFFFF !important;
}

.fc-acct-ico {
  display: inline-flex;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
}

.fc-acct-ico svg { display: block; }

/* Cerrar sesion al final, separado y en tono apagado */
.woocommerce-MyAccount-navigation-link--customer-logout {
  margin-top: 6px !important;
  padding-top: 6px !important;
  border-top: 1px solid var(--fc-line) !important;
}

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


/* --------------------------------------------------------------------------
   4. PANEL DE CONTENIDO
   -------------------------------------------------------------------------- */

.woocommerce-MyAccount-content {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0;
  font-family: 'Mulish', sans-serif;
  color: var(--fc-text);
}

.woocommerce-MyAccount-content > h2,
.woocommerce-MyAccount-content > h3,
.fc-acct-title {
  font-family: 'Fraunces', serif !important;
  color: var(--fc-head) !important;
  font-weight: 500 !important;
}

.woocommerce-MyAccount-content > h2,
.fc-acct-title {
  font-size: 26px !important;
  line-height: 1.2 !important;
  margin: 0 0 6px !important;
}

.fc-acct-sub {
  font: 400 14px/1.6 'Mulish', sans-serif;
  color: var(--fc-muted);
  margin: 0 0 24px;
}

/* Texto introductorio suelto de algunas vistas */
.woocommerce-MyAccount-content > p:first-child {
  font: 400 14px/1.6 'Mulish', sans-serif;
  color: var(--fc-muted);
  margin: 0 0 20px;
}

.fc-card {
  background: var(--fc-card);
  border: 1px solid var(--fc-line);
  border-radius: 18px;
  padding: 28px;
  box-sizing: border-box;
  max-width: 100%;
}


/* --------------------------------------------------------------------------
   5. ESCRITORIO: tarjetas de acceso rapido
   -------------------------------------------------------------------------- */

.fc-dash-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

.fc-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
}

.fc-cards .fc-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 24px;
}

.fc-card-label {
  font: 700 11px/1.3 'Mulish', sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--fc-muted);
}

.fc-card-order {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}

.fc-card-num {
  font: 500 22px/1 'Fraunces', serif;
  color: var(--fc-head);
}

.fc-card-date {
  font: 400 13px/1 'Mulish', sans-serif;
  color: var(--fc-muted);
}

.fc-card-body {
  font: 400 14px/1.6 'Mulish', sans-serif;
  color: var(--fc-text);
  margin: 0;
}

.fc-card-note {
  font: 400 13px/1.6 'Mulish', sans-serif;
  color: var(--fc-muted);
  margin: 0;
}

.fc-card-link {
  margin-top: auto;
  font: 600 14px/1.3 'Mulish', sans-serif;
  color: var(--fc-slate) !important;
  text-decoration: none !important;
}

.fc-card-link:hover { color: var(--fc-green) !important; }

/* Etiqueta de estado del pedido */
.fc-badge {
  align-self: flex-start;
  font: 700 11px/1 'Mulish', sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(94, 122, 78, .12);
  color: var(--fc-green);
}

.fc-badge--processing { background: rgba(166, 124, 52, .14); color: var(--fc-gold); }
.fc-badge--completed  { background: rgba(94, 122, 78, .14);  color: var(--fc-green); }
.fc-badge--cancelled,
.fc-badge--failed,
.fc-badge--refunded   { background: rgba(163, 74, 74, .12);  color: #A34A4A; }


/* --------------------------------------------------------------------------
   6. PEDIDOS y tablas de la cuenta
   Limitado a la cuenta para no tocar las tablas de carrito y pago.
   -------------------------------------------------------------------------- */

.woocommerce-MyAccount-content .shop_table,
.woocommerce-orders-table,
.woocommerce-table--order-downloads {
  width: 100% !important;
  max-width: 100%;
  border: 1px solid var(--fc-line) !important;
  border-radius: 18px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden;
  background: var(--fc-card);
  box-sizing: border-box;
}

.woocommerce-MyAccount-content .shop_table thead th {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--fc-line) !important;
  padding: 16px 20px !important;
  font: 700 10px/1 'Mulish', sans-serif !important;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--fc-muted) !important;
  text-align: left;
}

.woocommerce-MyAccount-content .shop_table tbody td {
  border: 0 !important;
  border-top: 1px solid var(--fc-line) !important;
  padding: 18px 20px !important;
  font: 400 14px/1.5 'Mulish', sans-serif !important;
  color: var(--fc-text) !important;
  vertical-align: middle;
}

.woocommerce-orders-table tbody tr:first-child td { border-top: 0 !important; }

.woocommerce-orders-table__cell-order-number a {
  font: 600 15px/1 'Mulish', sans-serif;
  color: var(--fc-slate) !important;
  text-decoration: none !important;
}

.woocommerce-orders-table__cell-order-date { white-space: nowrap; }


/* --------------------------------------------------------------------------
   7. DETALLE DEL PEDIDO
   -------------------------------------------------------------------------- */

.woocommerce-order-details,
.woocommerce-customer-details {
  background: var(--fc-card);
  border: 1px solid var(--fc-line);
  border-radius: 18px;
  padding: 28px;
  margin-bottom: 20px !important;
  box-sizing: border-box;
}

.woocommerce-order-details__title,
.woocommerce-column__title {
  font: 500 18px/1.2 'Fraunces', serif !important;
  color: var(--fc-head) !important;
  margin: 0 0 18px !important;
}

.woocommerce-MyAccount-content .woocommerce-table--order-details {
  border: 0 !important;
  border-radius: 0 !important;
}

.woocommerce-table--order-details tfoot th,
.woocommerce-table--order-details tfoot td {
  border: 0 !important;
  border-top: 1px solid var(--fc-line) !important;
  padding: 12px 0 !important;
  font: 400 14px/1.5 'Mulish', sans-serif !important;
}

.woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-table--order-details tfoot tr:last-child td {
  font-weight: 700 !important;
  color: var(--fc-head) !important;
}

.woocommerce-customer-details .woocommerce-columns--addresses {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 24px;
}

.woocommerce-customer-details address {
  border: 0 !important;
  padding: 0 !important;
  font: 400 14px/1.7 'Mulish', sans-serif !important;
  font-style: normal !important;
  color: var(--fc-text);
}


/* --------------------------------------------------------------------------
   8. DIRECCIONES
   -------------------------------------------------------------------------- */

body.woocommerce-account #main-content .woocommerce-Addresses {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: 20px !important;
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}

body.woocommerce-account #main-content .woocommerce-Addresses > .u-column1,
body.woocommerce-account #main-content .woocommerce-Addresses > .u-column2,
body.woocommerce-account #main-content .woocommerce-Addresses > .col-1,
body.woocommerce-account #main-content .woocommerce-Addresses > .col-2 {
  float: none !important;
  clear: none !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 24px !important;
  background: var(--fc-card);
  border: 1px solid var(--fc-line);
  border-radius: 18px;
  box-sizing: border-box;
}

/* El enlace de editar va debajo del titulo, en una sola linea */
.woocommerce-Address-title {
  display: block !important;
  margin-bottom: 14px;
}

.woocommerce-Address-title h2,
.woocommerce-Address-title h3 {
  font: 500 18px/1.2 'Fraunces', serif !important;
  color: var(--fc-head) !important;
  margin: 0 0 8px !important;
}

.woocommerce-Address-title .edit {
  display: inline-block;
  white-space: nowrap;
  font: 600 13px/1.3 'Mulish', sans-serif;
  color: var(--fc-slate) !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--fc-line);
}

.woocommerce-Address address {
  border: 0 !important;
  padding: 0 !important;
  font: 400 14px/1.7 'Mulish', sans-serif !important;
  font-style: normal !important;
  color: var(--fc-text);
}


/* --------------------------------------------------------------------------
   9. FORMULARIOS: direcciones, datos de cuenta
   -------------------------------------------------------------------------- */

.woocommerce-MyAccount-content form {
  background: var(--fc-card);
  border: 1px solid var(--fc-line);
  border-radius: 18px;
  padding: 28px;
  box-sizing: border-box;
  max-width: 100%;
}

.woocommerce-MyAccount-content form .woocommerce-form-row,
.woocommerce-MyAccount-content form p.form-row {
  margin: 0 0 16px !important;
  padding: 0 !important;
}

.woocommerce-MyAccount-content .form-row-first,
.woocommerce-MyAccount-content .form-row-last {
  width: calc(50% - 8px) !important;
  float: none !important;
  display: inline-block;
  vertical-align: top;
}

.woocommerce-MyAccount-content .form-row-first { margin-right: 12px !important; }

.woocommerce-MyAccount-content label {
  display: block;
  margin-bottom: 7px;
  font: 600 13px/1.3 'Mulish', sans-serif !important;
  color: var(--fc-head) !important;
}

.woocommerce-MyAccount-content .required { color: var(--fc-green); }

.woocommerce-MyAccount-content input[type="text"],
.woocommerce-MyAccount-content input[type="email"],
.woocommerce-MyAccount-content input[type="tel"],
.woocommerce-MyAccount-content input[type="password"],
.woocommerce-MyAccount-content select,
.woocommerce-MyAccount-content textarea,
.woocommerce-MyAccount-content .select2-container .select2-selection--single {
  width: 100% !important;
  box-sizing: border-box;
  padding: 12px 14px !important;
  height: auto !important;
  border: 1px solid var(--fc-line) !important;
  border-radius: 12px !important;
  background: var(--fc-card) !important;
  font: 400 16px/1.4 'Mulish', sans-serif !important;
  color: var(--fc-text) !important;
  box-shadow: none !important;
}

.woocommerce-MyAccount-content input:focus,
.woocommerce-MyAccount-content select:focus,
.woocommerce-MyAccount-content textarea:focus {
  outline: none !important;
  border-color: var(--fc-green) !important;
  box-shadow: 0 0 0 4px rgba(94, 122, 78, .14) !important;
}

.woocommerce-MyAccount-content fieldset {
  margin: 28px 0 0 !important;
  padding: 24px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--fc-line) !important;
}

.woocommerce-MyAccount-content fieldset legend {
  font: 500 18px/1.2 'Fraunces', serif !important;
  color: var(--fc-head) !important;
  padding: 0 !important;
  margin-bottom: 6px;
}

.woocommerce-MyAccount-content em,
.woocommerce-MyAccount-content .description {
  display: block;
  font: 400 13px/1.6 'Mulish', sans-serif;
  color: var(--fc-muted);
  font-style: normal;
}


/* --------------------------------------------------------------------------
   10. METODOS DE PAGO: caja de tarjeta en Anadir metodo de pago
   -------------------------------------------------------------------------- */

body.woocommerce-account #add_payment_method #payment {
  background: transparent !important;
  border: 0 !important;
}

body.woocommerce-account #add_payment_method #payment ul.wc_payment_methods {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.woocommerce-account #add_payment_method #payment div.payment_box {
  background: var(--fc-bg) !important;
  border-radius: 12px !important;
  margin: 14px 0 0 !important;
}

body.woocommerce-account #add_payment_method #payment div.payment_box::before {
  display: none !important;
}

body.woocommerce-account #add_payment_method #place_order {
  width: auto !important;
}


/* --------------------------------------------------------------------------
   11. BOTONES
   -------------------------------------------------------------------------- */

body.woocommerce-account #main-content .woocommerce .button,
body.woocommerce-account #main-content .woocommerce button.button,
body.woocommerce-account #main-content .woocommerce input[type="submit"],
.fc-btn {
  display: inline-block;
  padding: 13px 26px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--fc-slate) !important;
  color: #FFFFFF !important;
  font: 700 14px/1.2 'Mulish', sans-serif !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer;
  transition: background .18s ease;
}

body.woocommerce-account #main-content .woocommerce .button:hover,
body.woocommerce-account #main-content .woocommerce button.button:hover,
body.woocommerce-account #main-content .woocommerce input[type="submit"]:hover,
.fc-btn:hover {
  background: var(--fc-green) !important;
  color: #FFFFFF !important;
}

/* Divi mete un ::after con flecha en los botones */
body.woocommerce-account #main-content .woocommerce .button::after,
.fc-btn::after { display: none !important; }

.fc-btn--ghost {
  background: var(--fc-card) !important;
  border: 1px solid var(--fc-slate) !important;
  color: var(--fc-slate) !important;
}

.fc-btn--ghost:hover {
  background: var(--fc-slate) !important;
  color: #FFFFFF !important;
}

.woocommerce-orders-table .button {
  padding: 9px 16px !important;
  font-size: 13px !important;
}


/* --------------------------------------------------------------------------
   12. AVISOS Y ESTADOS VACIOS
   -------------------------------------------------------------------------- */

.woocommerce-MyAccount-content .woocommerce-info,
.woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-MyAccount-content .woocommerce-error,
.fc-empty {
  background: var(--fc-card) !important;
  border: 1px solid var(--fc-line) !important;
  border-radius: 18px !important;
  padding: 32px !important;
  margin: 0 0 20px !important;
  font: 400 14px/1.7 'Mulish', sans-serif !important;
  color: var(--fc-muted) !important;
  list-style: none !important;
}

.woocommerce-MyAccount-content .woocommerce-info::before,
.woocommerce-MyAccount-content .woocommerce-message::before,
.woocommerce-MyAccount-content .woocommerce-error::before {
  display: none !important;
}

.woocommerce-MyAccount-content .woocommerce-error   { border-color: #E0C3C3 !important; }
.woocommerce-MyAccount-content .woocommerce-message { border-color: #C8D6BC !important; }

.fc-empty-title {
  font: 500 18px/1.2 'Fraunces', serif;
  color: var(--fc-head);
  margin: 0 0 8px;
}


/* --------------------------------------------------------------------------
   13. ACCESO SIN SESION
   -------------------------------------------------------------------------- */

body:not(.logged-in).woocommerce-account #main-content .woocommerce {
  max-width: 1120px;
  margin: 0 auto !important;
}

.woocommerce-account #customer_login {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 40px;
  background: var(--fc-card);
  border: 1px solid var(--fc-line);
  border-radius: 18px;
  padding: 40px;
}

.woocommerce-account #customer_login .u-column1,
.woocommerce-account #customer_login .u-column2 {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce-account #customer_login .u-column2 {
  border-left: 1px solid var(--fc-line);
  padding-left: 40px !important;
}

.woocommerce-account #customer_login h2 {
  font: 500 26px/1.2 'Fraunces', serif !important;
  color: var(--fc-head) !important;
  margin: 0 0 6px !important;
}

/* Formulario de acceso solo, cuando el registro esta desactivado */
.woocommerce-account .woocommerce-form-login {
  max-width: 520px;
  margin: 0 auto !important;
}

.woocommerce-form-login__rememberme {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  font: 400 14px/1 'Mulish', sans-serif !important;
  color: var(--fc-text) !important;
}

.woocommerce-form-login__rememberme input { accent-color: var(--fc-green); }

.woocommerce-LostPassword {
  margin: 14px 0 0 !important;
  font: 600 14px/1 'Mulish', sans-serif;
}

.woocommerce-LostPassword a {
  color: var(--fc-slate) !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--fc-line);
}

.woocommerce-LostPassword a:hover {
  color: var(--fc-green) !important;
  border-color: var(--fc-green);
}

.woocommerce-privacy-policy-text p {
  font: 400 13px/1.6 'Mulish', sans-serif !important;
  color: var(--fc-muted) !important;
}


/* --------------------------------------------------------------------------
   14. TELEFONO Y TABLETA: hasta 980 px
   -------------------------------------------------------------------------- */

@media (max-width: 980px) {

  body.logged-in.woocommerce-account .woocommerce-MyAccount-navigation {
    margin: 0 0 20px !important;
  }

  .fc-cards,
  body.woocommerce-account #main-content .woocommerce-Addresses {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* Tabla de pedidos convertida en tarjetas, con el data-title de Woo */
  .woocommerce-orders-table {
    border: 0 !important;
    background: transparent !important;
  }

  .woocommerce-orders-table thead { display: none; }

  .woocommerce-orders-table tbody tr {
    display: block;
    background: var(--fc-card);
    border: 1px solid var(--fc-line);
    border-radius: 18px;
    padding: 16px;
    margin-bottom: 12px;
  }

  .woocommerce-MyAccount-content .woocommerce-orders-table tbody td {
    display: block;
    border: 0 !important;
    padding: 0 0 10px !important;
    text-align: left !important;
  }

  .woocommerce-orders-table tbody td::before {
    content: attr(data-title);
    display: block;
    font: 700 10px/1 'Mulish', sans-serif;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--fc-muted);
    margin-bottom: 5px;
  }

  .woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-actions::before {
    display: none;
  }

  /* Acceso y registro en una sola columna */
  .woocommerce-account #customer_login {
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
    padding: 28px;
  }

  .woocommerce-account #customer_login .u-column2 {
    border-left: 0;
    border-top: 1px solid var(--fc-line);
    padding-left: 0 !important;
    padding-top: 28px !important;
  }

  .woocommerce-MyAccount-content .form-row-first,
  .woocommerce-MyAccount-content .form-row-last {
    width: 100% !important;
    margin-right: 0 !important;
  }

  .fc-card,
  .woocommerce-MyAccount-content form,
  .woocommerce-order-details,
  .woocommerce-customer-details {
    padding: 20px;
  }
}
/* --------------------------------------------------------------------------
   15. ENLACE DE REGISTRO
   Visible solo sin sesion, centrado bajo el formulario de acceso.
   -------------------------------------------------------------------------- */

body.logged-in.woocommerce-account .fc-registro {
  display: none !important;
}

body.woocommerce-account .fc-registro {
  max-width: 520px;
  margin: 24px auto 0 !important;
  text-align: center;
}

body.woocommerce-account .fc-registro p {
  font: 400 14px/1.6 'Mulish', sans-serif;
  color: var(--fc-muted);
  padding: 0 !important;
}

body.woocommerce-account .fc-registro a {
  font-weight: 700;
  color: var(--fc-slate) !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--fc-line);
  transition: color .18s ease, border-color .18s ease;
}

body.woocommerce-account .fc-registro a:hover {
  color: var(--fc-green) !important;
  border-color: var(--fc-green);
}

.fc-ayuda-txt strong {
  color: var(--fc-head);
  font-weight: 700;
}

/* --------------------------------------------------------------------------
   16. FRANJA DE AYUDA
   -------------------------------------------------------------------------- */

body.woocommerce-account .fc-ayuda {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 28px;
  padding: 18px 22px;
  border: 1px solid #DDE2E2;
  border-radius: 18px;
    background: #FFFFFF;
}

body.woocommerce-account .fc-ayuda .fc-ayuda-txt {
  flex: 1 1 280px;
  margin: 0 !important;
  padding: 0 !important;
  font: 400 14px/1.6 'Mulish', sans-serif;
  color: #5A7088;
}

body.woocommerce-account .fc-ayuda .fc-ayuda-txt strong {
  color: #2A3B4D;
  font-weight: 700;
}

body.woocommerce-account .fc-ayuda a.fc-ayuda-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 20px;
  border-radius: 999px;
  background: #3E556C !important;
  color: #FFFFFF !important;
  font: 700 14px/1 'Mulish', sans-serif;
  text-decoration: none !important;
  white-space: nowrap;
  transition: background .18s ease;
}

body.woocommerce-account .fc-ayuda a.fc-ayuda-btn:hover {
  background: #5E7A4E !important;
  color: #FFFFFF !important;
}

@media (max-width: 600px) {
  body.woocommerce-account .fc-ayuda .fc-ayuda-acciones,
  body.woocommerce-account .fc-ayuda a.fc-ayuda-btn {
    width: 100%;
  }
}