/* FILE:
 /wp-content/themes/us-child/assets/css/custom-checkout.css
*/

body.woocommerce-checkout{
    background:#0f1115;
    color:#fff;
}




/* --- MULTI-STEP CHECKOUT ERROR ICON FIX --- */
/* --- NATIVE WOOCOMMERCE STANDARD ICON INTEGRATION --- */

.mid-checkout-errors-wrapper .woocommerce-error {
    position: relative !important;
    padding: 20px 20px 20px 55px !important; /* Spacing layout for the core icon */
}

/* Force standard WordPress/WooCommerce Dashicon symbol context */
.mid-checkout-errors-wrapper .woocommerce-error::before {
    content: "\f348" !important; /* Native Core Warning Exclamation Code */
    font-family: "dashicons" !important; /* Force core WordPress asset system */
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important; /* Perfect fluid vertical centering */
    left: 20px !important;
    font-size: 22px !important;
    line-height: 1 !important;
    color: #fff !important; /* Match core notice red accent */
    display: inline-block !important;
    speak: never;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Clear style collisions on internal list outputs */
.mid-checkout-errors-wrapper .woocommerce-error li {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.5 !important;
    font-weight: 500 !important;
}


.mid-checkout-right:before {
    content: "";
    position: absolute;
    inset-inline: 0;
    height: 12px;
    background-image: radial-gradient(farthest-side, transparent 6px, #121212 0);
    background-size: 15px 15px;
    top: 56px;
    background-position: -2px -6px, 0 0;
}

.mid-checkout{
    width:100%;
}

.mid-checkout-wrapper {
    display: grid;
    grid-template-columns: minmax(0,1fr) 45%;
    gap: 30px;
    max-width: 1400px;
    margin: 0 auto;
    padding: 60px 40px;
}
.mid-checkout-left{
    min-width:0;
}

.mid-checkout-right{
    position:relative;
}

.mid-summary-sticky {
    position: sticky;
    top: 40px;
    background: black;
    border: 0px;
    border-radius: 5px;
    padding: 30px;
}
.mid-card {
    /* background: #171b21; */
    /* border: 1px solid #2b3139; */
    border-radius: 12px;
    /* padding: 24px; */
}

.mid-card h2{
    margin-bottom:30px;
    font-size:32px;
    color:#fff;
}

.mid-steps-nav{
    display:flex;
    gap:20px;
    margin-bottom:30px;
}

.mid-step-indicator{
    display:flex;
    align-items:center;
    gap:10px;
    opacity:.5;
    transition:all .3s ease;
}

.mid-step-indicator.active{
    opacity:1;
}

.mid-step-number{
    width:38px;
    height:38px;
    border-radius:50%;
    background:#2a3038;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
}

.mid-step-indicator.active .mid-step-number{
    background:#fff;
    color:#000;
}

.mid-checkout-step{
    display:none;
}

.mid-checkout-step.active{
    display:block;
}

.mid-fields{
    display:grid;
    grid-template-columns:repeat(1,minmax(0,1fr));
    gap:20px;
}

.mid-fields .form-row-wide{
    grid-column:span 2;
}

.mid-fields label{
    color:#fff;
    font-size:13px;
    margin-bottom:8px;
    display:block;
    font-weight:600;
}

.mid-fields input:not(.input-checkbox), .mid-fields select, .mid-fields textarea {
    width: 100%;
    background: transparent;
    border: 2px solid #343c46 !important;
    color: #fff !important;
    border-radius: 5px !important;
    height: 40px;
    padding: 6px 6px !important;
min-heigh:40px;
}

.mid-fields input:focus,
.mid-fields select:focus{
    border-color:#fff !important;
}

.mid-next-step,
.mid-prev-step,
#place_order{
    min-height:58px;
    border-radius:14px !important;
    font-size:16px !important;
    font-weight:700 !important;
}

.mid-next-step,
#place_order{
    background:#fff !important;
    color:#000 !important;
    width:100%;
}

.mid-prev-step{
    background:transparent !important;
    border:1px solid #343c46 !important;
    color:#fff !important;
}

.mid-step-buttons{
    display:flex;
    gap:20px;
    margin-top:30px;
}

.mid-step-buttons button{
    flex:1;
}

.woocommerce-checkout-review-order-table{
    background:transparent !important;
    color:#fff;
}

.shop_table th,
.shop_table td{
    border-color:#2f353d !important;
}

#payment{
    background:transparent !important;
}
div#order_review {
    background: transparent !important;
}
.wc_payment_method{
  /*  background:#0f1115;*/
    border:1px solid #2b3139;
    border-radius:5px;
    margin-bottom:16px !important;
    padding:16px !important;
}

.payment_box {
    background: transparent !important;
    color: #fff !important;
}
li.wc_payment_method img {
    position: absolute;
    right: 20px;
}

li.wc_payment_method {
    position: relative;
}

.mid-fields .select2-container--default .select2-selection--single {
    background: transparent;
    border: 1px solid #343c46 !important;
    height: 35px !important;
    border-radius: 5px !important;
}

.mid-fields .select2-selection__rendered {
    line-height: 35px !important;
    color: #fff !important;
}

.mid-fields .select2-selection__arrow{
    height:56px !important;
}


.mid-checkout-wrapper wc-order-attribution-inputs {
    position: absolute;
    left: -2000px;
    width: 1px;
    overflow: hidden;
}

.mid-checkout-right .woocommerce-checkout-review-order:not(.w-checkout-order-review) {
    display: block !important;
    width: 100% !important;
    float: none !important;
    padding:10px !important;
}

.mid-checkout-right tr.woocommerce-shipping-totals.shipping {
    display: none;
}
.mid-fields .form-row {
    position: relative;
    margin: 0 0 1rem;
}
.mid-checkout-right tr.woocommerce-shipping-totals.shipping th {
    display: none;
}
/* Indica que o passo é clicável */
.mid-step-indicator {
    cursor: pointer;
    transition: opacity 0.2s;
}

.mid-step-indicator:hover {
    opacity: 0.8;
}

/* Opcional: Estilo para passos já visitados (pode adicionar a classe via JS) */
.mid-step-indicator.completed .mid-step-number {
    background-color: #4CAF50; /* Verde, por exemplo */
    color: white;
}
@media (min-width: 768px) {
    /* Selecionamos especificamente os IDs para garantir prioridade sobre as classes do JS */
    #billing_country_field, 
    #billing_state_field {
        width: 48% !important;
        float: left !important;
        clear: none !important;
        display: inline-block !important;
    }

    /* Margem apenas no primeiro (Country) */
    #billing_country_field {
        margin-right: 4% !important;
    }

    /* Forçar o District a flutuar à direita se o JS injetar algo no meio */
    #billing_state_field {
        float: right !important;
    }

    /* Corrigir o container do Select2 que o WooCommerce usa */
    .mid-checkout .select2-container {
        width: 100% !important;
    }
}

/* Garante que em mobile voltam a 100% */
@media (max-width: 767px) {
    #billing_country_field, 
    #billing_state_field {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
    }
}

@media(max-width:1024px){

  .mid-checkout-wrapper {
    grid-template-columns: 1fr;
    padding: 0px;
}
.mid-step-buttons {
    display: block;
    gap: 0px;
    margin-top: 0px;
}
button.button.mid-prev-step {

    width: 100%;
}
    .mid-checkout-right{
        order:-1;
    }

    .mid-summary-sticky{
        position:relative;
        top:auto;
    }

}

button.button.alt.mid-next-step {
    margin-top: 20px;
}

textarea#order_comments {
    min-height: 100px !important;
}

.mid-checkout-right {
    position: relative;
    padding-top: 65px;
}

em#parcel_shop_info {
    font-size: 12px;
    font-weight: 400;
    line-height: 10px;
}

tr.mrwp td,tr.mrwp th {
    border-bottom: 17px solid transparent !important;
    border-top: 17px solid transparent;
}

tr.mrwp {
    background: transparent !important;
}
.order-total small.includes_tax {
    font-size: 10px;
}
button.button.mid-prev-step {
    margin-top: 20px !important;
    height: 50px !important;
}
.woocommerce-checkout #ship-to-different-address {
    margin: 1rem 0 !important;

}

/* Container do nome do produto na tabela do checkout */
.woocommerce-checkout-review-order-table .product-name {
    display: flex;
    align-items: center;
    gap: 15px;
}

.mid-checkout-product-image img {
    border-radius: 8px;
    border: 1px solid #e2e2e2;
    display: block;
}

.mid-checkout-product-name {
    font-weight: 400;
    font-size: 12px;
}
.mid-checkout-product-image {
    min-width: 40px !important;
    /* border: 0px !important; */
}
.mid-checkout-product-image img {
    border: 0px !important;
    max-width: 40px !important;
    height: auto;
}
.mid-checkout-wrapper tr.woocommerce-shipping-totals.shipping th {
    display: none;
}
.woocommerce-shipping-totals td {
    border: 0px !important;
}
.woocommerce-checkout-review-order th, .woocommerce-checkout-review-order td {
    /* border-color: #2f353d !important; */
    border-bottom: 2px #2f353d  solid !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.mid-checkout-right tr.mrwp td,.mid-checkout-right tr.mrwp th {
    /* border-bottom: 17px solid transparent !important; */
    border-top: 17px solid #000 !important;
}

.mid-qty-stepper.quantity {
    display: inline-flex;
    align-items: center;
    background: #1a1a1a;
    border: 1px solid #444;
    border-radius: 8px;
    overflow: hidden;
    height: 30px;
    max-width: 80px;
    min-width: 80px;
}
/* Botões - e + */
.mid-qty-stepper.quantity .btn {
    background: transparent !important;
    color: #fff !important;
    border: none !important;
    width: 35px;
    height: 100%;
    cursor: pointer;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background 0.2s;
}

.mid-qty-stepper.quantity .btn:hover {
    background: #333 !important;
}

/* Linhas divisórias verticais */
.mid-qty-stepper.quantity .minus {
    border-right: 1px solid #444 !important;
}

.mid-qty-stepper.quantity .plus {
    border-left: 1px solid #444 !important;
}

/* Campo do número */
.mid-qty-stepper.quantity .qty {
    background: transparent !important;
    color: #fff !important;
    border: none !important;
    width: 30px !important;
    text-align: center;
    font-size: 14px;
    padding: 0 !important;
    margin: 0 !important;
    height: 100% !important;
    -moz-appearance: textfield;
}

/* Remover setas nativas do input */
.mid-qty-stepper.quantity input::-webkit-outer-spin-button,
.mid-qty-stepper.quantity input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

a.mid-remove-item {
    display: block;
    font-size: 1.5rem;
    line-height: 2rem;
    
    text-decoration: none!important;
    color: inherit;
    opacity: .5;
}
@media(min-width:768px){
  .woocommerce-checkout-review-order-table .product-name {
      display: flex;
      align-items: start;
      gap: 10px;
      width: 100% !important;
  }
}
@media(max-width:767px){
  /* Force the 3 steps to share the width equally */
      .mid-step-indicator {
          display: flex;
          flex-direction: column; /* Stack number over text */
          align-items: center;    /* Center them horizontally */
          text-align: center;
          flex: 1;                /* Forces all 3 to take up exactly 33.33% width */
          gap: 4px;               /* Tighten vertical gap for small screens */
      }

      /* Responsive typography adjustment to prevent text wrapping aggressively */
      .mid-step-label {
          font-size: 12px;       /* Scale down text size slightly for tight mobile fit */
          word-break: break-word; /* Prevents overflow if a word is long */
      }
      
      .mid-step-number {
          font-size: 14px;
          font-weight: bold;
      }
  .mid-checkout-left {
      order: 1;
  }
  .mid-checkout-right {
  
      order: 2;
  }



  .mid-summary-sticky tr.cart_item:after {content: " ";position: absolute;height: 1px;background: #2f353d !important;display: block;width: 100%;bottom: 0px;}

  .mid-summary-sticky tr.cart_item {
      position: relative;
  }


 .woocommerce table.shop_table .cart-subtotal td {
      display: block;
      border: none!important;
      text-align: right !important;
  }

  .mid-summary-sticky tr.cart_item ,.mid-summary-sticky tr.cart-subtotal,.mid-summary-sticky tr.order-total{
      display: flex;
      align-items: center;
    gap: 10px;
  }
  .woocommerce table.shop_table .thead th, .woocommerce table.shop_table tbody td {
      display: block;
      border: none!important;
      text-align: inherit!important;
  }
  .woocommerce-checkout-review-order:not(.w-checkout-order-review) {
      margin: 0px !important;
  }
  .mid-summary-sticky tfoot th {
      text-align: right !important;
  }
    .mid-fields{
        grid-template-columns:1fr;
    }

    .mid-fields .form-row-wide{
        grid-column:span 1;
    }

    .mid-card {
        /* background: #171b21; */
        /* border: 1px solid #2b3139; */
        border-radius: 12px;
        /* padding: 24px; */
    }

    .mid-steps-nav{
        overflow:auto;
        padding-bottom:10px;
    }

}

.payment_method_ppcp label img {
    position: absolute;
    right: 17px;
}

.payment_method_ppcp {
    position: relative;
}
.woocommerce-order {
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
}
.woocommerce-table--order-details {
 
    background: transparent !important;
}
.woocommerce-table--order-details {
    border: none !important;
}
a.woocommerce-button.button.order-actions-button {
    margin: 2px;
    padding: 5px 20px;
}
.woocommerce-table--order-details thead {
    display: table-header-group;
    font-weight: 600;
    text-transform: uppercase;
}
.woocommerce-table--order-details  .order_item a {
    color: #fff;
}
section.woocommerce-order-details th,section.woocommerce-order-details td {
    border-bottom: 1px solid rgba(255,255,255,0.15);
    text-transform: none;
    font-size: inherit;
}
p.woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received {
   padding: 3%;
    width: 100%;
    color: #7A9C59;
    border: 2px dashed #7A9C59;
    border-radius: var(--wd-brd-radius);
    text-align: center;
    font-weight: 600;
    font-size: 22px;
    line-height: 1.4;

}

:is(.woocommerce-thankyou-order-details,.wc-bacs-bank-details) li {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1 1 0%;
}
:is(.woocommerce-thankyou-order-details,.wc-bacs-bank-details) li:not(:last-child) {
    padding-inline-end: 20px;
    border-inline-end: 1px solid rgba(255, 255, 255, 0.15);
}
.woocommerce-thankyou-order-details li {

    margin-inline-end: 0em !important;
}
:is(.woocommerce-thankyou-order-details,.wc-bacs-bank-details) {
  
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    list-style: none;
}
.woocommerce-order-received .woocommerce-thankyou-order-details {

    background: transparent !important;
}
.woocommerce-order-received .woocommerce-table--order-details :is(th,td) {
    max-width: 50%;
    width: 50%;
}

.woocommerce-order-received .woocommerce-table--order-details  th ,.woocommerce-order-received .woocommerce-table--order-details  td{
    padding: 15px 10px;
    border-bottom: 2px solid rgba(255, 255, 255, 0.1);


    font-size: 16px;
  
    vertical-align: middle !important;
    text-align: start;
}
/*
.mid-checkout-step .mrwpbutton.mrwpbuttoninpost {
    display: none;
}
*/
.woocommerce-order-received  .shop_table tr :is(td,th):last-child {
    padding-inline-end: 0;
    text-align: end;
}

.woocommerce .shop_table thead th {

   opacity: 1 !important; 
}
.woocommerce-order-received  .shop_table  th {
    vertical-align: middle;
}
.woocommerce-shipping-methods input[type="radio"] {
    border-radius: 50% !important;
    border: 2px solid #a3b1ff;
    margin-left: 5px;
}
.woocommerce-checkout-review-order-table .blockOverlay, .woocommerce-checkout-review-order-table thead {
    display: table-header-group !important;

}
ul.woocommerce-thankyou-order-details strong {
    font-size: 12px;
    text-align: center;
}
.woocommerce-order-received  h2.woocommerce-order-details__title {
    padding-left: 10px;
}
.mid-summary-sticky h3 {
    text-align:center;
    
    font-weight: 600;
}

/* --- TRANCAR PAÍS E ESTADO LADO A LADO (MIDCACHE FIX) --- */

/* --- TRANCAR CHECKOUT COM FLEXBOX ORDER (SOLUÇÃO BLINDADA) --- */

/* 1. Ativar Flexbox no bloco de campos de faturação */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0 !important; /* Controlamos os espaçamentos manualmente nos campos */
}

/* 2. Atribuir uma ordem visual sequencial para cada bloco <p> */
.woocommerce-checkout .form-row[id*="billing_first_name_field"]  { order: 10 !important; }
.woocommerce-checkout .form-row[id*="billing_last_name_field"]   { order: 15 !important; }
.woocommerce-checkout .form-row[id*="billing_company_field"]     { order: 20 !important; width: 100% !important; }

/* Morada (Rua) ocupa a largura toda */
.woocommerce-checkout .form-row[id*="billing_address_1_field"]   { order: 30 !important; width: 100% !important; }
.woocommerce-checkout .form-row[id*="billing_address_2_field"]   { order: 35 !important; width: 100% !important; }

/* Código Postal (Esquerda) e Cidade (Direita) lado a lado */
.woocommerce-checkout .form-row:has(input[name="billing_postcode"]) { 
    order: 40 !important; 
    width: 48% !important; 
    float: left !important;
    margin-right: 4% !important; 
}
.woocommerce-checkout .form-row:has(input[name="billing_city"]) { 
    order: 45 !important; 
    width: 48% !important; 
    float: right !important;
    margin-right: 0 !important; 
}

/* ⭐ O SEGREDO: Empurrar o País e o Distrito para o final, lado a lado */
.woocommerce-checkout .form-row:has(select[name="billing_country"]) { 
    order: 50 !important; 
    width: 48% !important; 
    float: left !important;
    margin-right: 4% !important;
    clear: both !important;
}
.woocommerce-checkout .form-row:has(select[name="billing_state"]),
.woocommerce-checkout .form-row:has(input[name="billing_state"]) { 
    order: 55 !important; 
    width: 48% !important; 
    float: right !important;
    margin-right: 0 !important;
    clear: none !important;
}

/* Telefone e Email no fim de tudo */
.woocommerce-checkout .form-row[id*="billing_phone_field"]       { order: 60 !important; width: 48% !important; float: left !important; margin-right: 4% !important; }
.woocommerce-checkout .form-row[id*="billing_email_field"]       { order: 65 !important; width: 48% !important; float: right !important; margin-right: 0 !important; }

/* 3. Ajuste Responsivo para Telemóveis */
@media (max-width: 768px) {
    .woocommerce-checkout .form-row:has(select[name="billing_country"]),
    .woocommerce-checkout .form-row:has(select[name="billing_state"]),
    .woocommerce-checkout .form-row:has(input[name="billing_state"]),
    .woocommerce-checkout .form-row:has(input[name="billing_postcode"]),
    .woocommerce-checkout .form-row:has(input[name="billing_city"]),
    .woocommerce-checkout .form-row[id*="billing_phone_field"],
    .woocommerce-checkout .form-row[id*="billing_email_field"] {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
    }
}