/* ============================================================
   CSS CUSTOM WooCommerce - Bagery Child
   Carrega em: is_account_page() OU is_checkout() (cobre thank-you)
   Principal #29989c | Escuro #3b3d5e | radius 8

   SECAO 1 - PAINEL DA CONTA  (escopado .woocommerce-account)
   SECAO 2 - CHECKOUT: ordem do form de endereco (Blocks)
   SECAO 3 - PAGINA DE OBRIGADO / DETALHES DO PEDIDO
   ============================================================ */


/* ============================================================
   SECAO 1 - PAINEL DA CONTA  (.woocommerce-account)
   ============================================================ */

/* ---------- base / layout ---------- */
.woocommerce-account .woocommerce {
  max-width: 1080px !important;
  margin: 40px auto !important;
  color: #3b3d5e !important;
}
.woocommerce-account .woocommerce a {
  color: #29989c !important;
}
.woocommerce-account .woocommerce h1,
.woocommerce-account .woocommerce h2,
.woocommerce-account .woocommerce h3 {
  color: #3b3d5e !important;
  font-weight: 600 !important;
}

/* ---------- LOGIN / REGISTRO (nao logado) ---------- */
.woocommerce-account #customer_login.u-columns {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 28px !important;
  align-items: stretch !important;
}
.woocommerce-account #customer_login .u-column1,
.woocommerce-account #customer_login .u-column2 {
  flex: 1 1 320px !important;
  width: auto !important;
  margin: 0 !important;
}
.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register,
.woocommerce-account .woocommerce-EditAccountForm,
.woocommerce-account .woocommerce-address-fields,
.woocommerce-account form.lost_reset_password {
  background: #ffffff !important;
  border: 1px solid #eef0f3 !important;
  border-radius: 8px !important;
  box-shadow: 0 6px 24px rgba(59,61,94,0.06) !important;
  padding: 32px !important;
  margin: 0 !important;
}
.woocommerce-account .col-1 > h2,
.woocommerce-account .col-2 > h2 {
  margin-bottom: 18px !important;
}

/* ---------- CAMPOS DE FORM (sem o select nativo) ---------- */
.woocommerce-account .woocommerce form .form-row label,
.woocommerce-account .woocommerce-form-row label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #3b3d5e !important;
  margin-bottom: 6px !important;
}
.woocommerce-account .woocommerce form .input-text,
.woocommerce-account .woocommerce input[type="text"],
.woocommerce-account .woocommerce input[type="email"],
.woocommerce-account .woocommerce input[type="tel"],
.woocommerce-account .woocommerce input[type="password"],
.woocommerce-account .woocommerce input[type="number"],
.woocommerce-account .woocommerce textarea {
  width: 100% !important;
  height: 46px !important;
  background: #ffffff !important;
  border: 1px solid #e2e5ea !important;
  border-radius: 8px !important;
  padding: 0 14px !important;
  font-size: 14px !important;
  color: #3b3d5e !important;
  box-shadow: none !important;
  transition: border-color .18s ease, box-shadow .18s ease !important;
}
.woocommerce-account .woocommerce textarea {
  height: auto !important;
  padding: 12px 14px !important;
}
.woocommerce-account .woocommerce form .input-text:focus,
.woocommerce-account .woocommerce input:focus,
.woocommerce-account .woocommerce textarea:focus {
  border-color: #29989c !important;
  box-shadow: 0 0 0 3px rgba(41,152,156,0.15) !important;
  outline: none !important;
}
.woocommerce-account .woocommerce input::placeholder,
.woocommerce-account .woocommerce textarea::placeholder {
  color: #a7adba !important;
}

/* ---------- BOTOES ---------- */
.woocommerce-account .woocommerce button.button,
.woocommerce-account .woocommerce a.button,
.woocommerce-account .woocommerce input.button,
.woocommerce-account .woocommerce .woocommerce-Button {
  background: #29989c !important;
  background-image: none !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  height: 46px !important;
  padding: 0 24px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  cursor: pointer !important;
  transition: background .18s ease, transform .06s ease !important;
}
.woocommerce-account .woocommerce button.button:hover,
.woocommerce-account .woocommerce a.button:hover,
.woocommerce-account .woocommerce input.button:hover,
.woocommerce-account .woocommerce .woocommerce-Button:hover {
  background: #22868a !important;
}
.woocommerce-account .woocommerce button.button:active {
  transform: translateY(1px) !important;
}
.woocommerce-account .woocommerce-form-login__rememberme,
.woocommerce-account .woocommerce-LostPassword {
  font-size: 13px !important;
  color: #6b7280 !important;
}

/* ---------- NAVEGACAO (forca o clean sobre o tema) ---------- */
.woocommerce-account .woocommerce-MyAccount-navigation {
  width: 26% !important;
  margin-bottom: 24px !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #ffffff !important;
  border: 1px solid #eef0f3 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link {
  background: transparent !important;
  background-image: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #f1f2f5 !important;
  border-radius: 0 !important;
  list-style: none !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
  border-bottom: 0 !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  display: block !important;
  padding: 14px 18px !important;
  background: transparent !important;
  background-image: none !important;
  color: #3b3d5e !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  transition: background .15s ease, color .15s ease !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
  background: #f6fafa !important;
  color: #29989c !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a:hover {
  background: #29989c !important;
  color: #ffffff !important;
}

/* ---------- CONTEUDO ---------- */
.woocommerce-account .woocommerce-MyAccount-content {
  width: 70% !important;
  background: #ffffff !important;
  border: 1px solid #eef0f3 !important;
  border-radius: 8px !important;
  padding: 32px !important;
  box-shadow: 0 6px 24px rgba(59,61,94,0.05) !important;
}

/* ---------- TABELAS (pedidos, downloads) ---------- */
.woocommerce-account .woocommerce table.shop_table {
  border: 1px solid #eef0f3 !important;
  border-radius: 8px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden !important;
}
.woocommerce-account .woocommerce table.shop_table thead th {
  background: #f6fafa !important;
  color: #3b3d5e !important;
  font-weight: 600 !important;
  border: none !important;
  padding: 14px 16px !important;
}
.woocommerce-account .woocommerce table.shop_table td {
  border-top: 1px solid #f1f2f5 !important;
  padding: 14px 16px !important;
  color: #3b3d5e !important;
}

/* ---------- AVISOS / MENSAGENS (neutraliza gradiente do tema) ---------- */
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-info,
.woocommerce-account .woocommerce-error {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #eef0f3 !important;
  border-left: 3px solid #29989c !important;
  border-radius: 8px !important;
  color: #3b3d5e !important;
}

/* ---------- NICE-SELECT (so dentro do my-account) ---------- */
/* esconde o <select> nativo e qualquer nice-select duplicado */
.woocommerce-account select:has(+ .nice-select),
.woocommerce-account .nice-select + select,
.woocommerce-account .nice-select ~ select,
.woocommerce-account .nice-select + .nice-select {
  display: none !important;
}
.woocommerce-account .nice-select {
  height: 46px !important;
  line-height: 44px !important;
  background: #ffffff !important;
  border: 1px solid #e2e5ea !important;
  border-radius: 8px !important;
  padding-left: 14px !important;
  padding-right: 30px !important;
  font-size: 14px !important;
  color: #3b3d5e !important;
  width: 100% !important;
  float: none !important;
  transition: border-color .18s ease, box-shadow .18s ease !important;
}
.woocommerce-account .nice-select:hover {
  border-color: #cfd4db !important;
}
.woocommerce-account .nice-select.open,
.woocommerce-account .nice-select:focus,
.woocommerce-account .nice-select:active {
  border-color: #29989c !important;
  box-shadow: 0 0 0 3px rgba(41,152,156,0.15) !important;
}
.woocommerce-account .nice-select:after {
  border-bottom: 2px solid #29989c !important;
  border-right: 2px solid #29989c !important;
  right: 14px !important;
}
.woocommerce-account .nice-select .list {
  background: #ffffff !important;
  border: 1px solid #eef0f3 !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(59,61,94,0.10) !important;
  margin-top: 6px !important;
  width: 100% !important;
}
.woocommerce-account .nice-select .option {
  line-height: 40px !important;
  min-height: 40px !important;
  color: #3b3d5e !important;
  padding-left: 14px !important;
}
.woocommerce-account .nice-select .option:hover,
.woocommerce-account .nice-select .option.focus,
.woocommerce-account .nice-select .option.selected.focus {
  background: #f6fafa !important;
  color: #29989c !important;
}
.woocommerce-account .nice-select .option.selected {
  font-weight: 600 !important;
  color: #29989c !important;
}

/* ---------- responsivo (conta) ---------- */
@media (max-width: 768px) {
  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-content {
    width: 100% !important;
  }
}


/* ============================================================
   SECAO 2 - CHECKOUT: reordenacao do form de endereco (Blocks)
   (layout original mantido; so age onde a classe existe)
   ============================================================ */
.wc-block-components-address-form {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 15px !important;
}
/* tamanho padrao das linhas */
.wc-block-components-address-form > div {
  width: 100% !important;
  order: 10; /* joga tudo sem ordem definida pro final */
}
/* ordem: endereco logo abaixo do CEP */
.wc-block-components-address-form > div:has(input[autocomplete*="postal-code"])    { order: 1; }
.wc-block-components-address-form > .wc-better                                       { order: 2; width: 100% !important; }
.wc-block-components-address-form > div:has(input[autocomplete*="address-line1"])  { order: 3; width: 48% !important; }
.wc-block-components-address-form > div:has(input[name*="number"])                  { order: 4; width: 48% !important; }
.wc-block-components-address-form > div:has(input[name*="neighborhood"])            { order: 5; width: 48% !important; }
.wc-block-components-address-form > div:has(input[autocomplete*="address-line2"])  { order: 6; width: 100% !important; }
.wc-block-components-address-form > div:has(input[autocomplete*="address-level2"]) { order: 7; width: 48% !important; }
.wc-block-components-address-form > div:has(select[autocomplete*="address-level1"]){ order: 8; width: 48% !important; }


/* ============================================================
   SECAO 3 - PAGINA DE OBRIGADO / DETALHES DO PEDIDO
   (thank-you = is_checkout; tambem aparece no view-order da conta)
   ============================================================ */

/* 1. cabecalho do pedido (Numero, Data, Total) */
.woocommerce-order-overview {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  margin-bottom: 40px !important;
  padding: 0 !important;
  list-style: none !important;
}
.woocommerce-order-overview li {
  flex: 1 1 200px !important;
  border: 1px solid #eef0f3 !important;
  border-radius: 8px !important;
  padding: 15px !important;
  background: #f6fafa !important;
  color: #3b3d5e !important;
  list-style: none !important;
  text-transform: uppercase;
  font-size: 12px;
}
.woocommerce-order-overview li strong {
  display: block !important;
  margin-top: 5px !important;
  font-size: 16px !important;
  color: #3b3d5e !important;
  text-transform: none !important;
}

/* 2. colunas de endereco 50/50 (mata clearfix fantasma do tema) */
.woocommerce-customer-details .col2-set::before,
.woocommerce-customer-details .col2-set::after {
  display: none !important;
}
.woocommerce-customer-details .col2-set {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  width: 100% !important;
  clear: both !important;
}
.woocommerce-customer-details .col2-set .col-1,
.woocommerce-customer-details .col2-set .col-2 {
  width: 48% !important;
  max-width: 48% !important;
  flex: 0 0 48% !important;
  float: none !important;
  clear: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 3. caixa de endereco */
.woocommerce-customer-details address {
  width: 100% !important;
  border: 1px solid #eef0f3 !important;
  border-radius: 8px !important;
  padding: 20px !important;
  line-height: 1.6 !important;
  font-style: normal !important;
  word-break: break-word !important;
  color: #3b3d5e !important;
}

/* 4. tabela de detalhes adicionais (CPF etc) */
.bctfw-order-confirmation-table {
  margin-top: 15px !important;
  width: 100% !important;
  border-collapse: collapse !important;
}
.bctfw-order-confirmation-table th,
.bctfw-order-confirmation-table td {
  padding: 8px !important;
  border: 1px solid #eef0f3 !important;
  text-align: left !important;
  color: #3b3d5e !important;
}
.bctfw-order-confirmation-table th {
  background: #f6fafa !important;
}

/* 5. mobile: empilha os enderecos (corrigido: era grid num flex) */
@media (max-width: 768px) {
  .woocommerce-customer-details .col2-set {
    flex-direction: column !important;
    gap: 20px !important;
  }
  .woocommerce-customer-details .col2-set .col-1,
  .woocommerce-customer-details .col2-set .col-2 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }
}