/* Checkout rassurant et moderne */

/* Cartes propres */
.woocommerce-checkout #customer_details,
.woocommerce-checkout .woocommerce-checkout-review-order,
.woocommerce-cart .cart-collaterals {
  background:#fff; 
  border-radius:18px; 
  padding:24px; 
  box-shadow:0 10px 30px rgba(15, 14, 38, .06);
  margin-bottom: 20px;
}

/* Groupes logiques */
.woocommerce form .form-row{ 
  margin-bottom:14px; 
}

.woocommerce form .form-row-first,
.woocommerce form .form-row-last{ 
  width:49%; 
  display:inline-block; 
  vertical-align:top; 
}

.woocommerce-checkout #payment{ 
  background:#fafafa; 
  border-radius:14px; 
  padding:16px 18px; 
}

/* Boutons rassurants */
.woocommerce a.button, 
.woocommerce button.button{
  background:#ffd000; 
  color:#1a1a1a; 
  border-radius:12px; 
  font-weight:700;
  padding: 12px 24px;
  transition: all 0.3s ease;
}

.woocommerce a.button:hover, 
.woocommerce button.button:hover{ 
  filter:brightness(.95);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(255, 208, 0, 0.3);
}

/* Badges confiance */
.tb-secure-badge{ 
  display:flex; 
  gap:.5rem; 
  align-items:center; 
  font-weight:600; 
  color:#2e7d32; 
  background: #e8f5e8;
  padding: 12px 16px;
  border-radius: 8px;
  margin-bottom: 20px;
}

.tb-secure-badge:before{ 
  content:"🔒"; 
  font-size: 18px;
}

/* Logos cartes de crédit */
.tb-payment-logos {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
}

.tb-payment-logos img {
  height: 24px;
  opacity: 0.7;
  transition: opacity 0.3s ease;
}

.tb-payment-logos img:hover {
  opacity: 1;
}

/* Barre de progression */
.tb-checkout-progress {
  display: flex;
  justify-content: center;
  margin-bottom: 30px;
  padding: 20px 0;
}

.tb-progress-step {
  display: flex;
  align-items: center;
  color: #6b7280;
  font-weight: 500;
}

.tb-progress-step.active {
  color: #6b21a8;
  font-weight: 700;
}

.tb-progress-step.completed {
  color: #059669;
}

.tb-progress-step:not(:last-child)::after {
  content: "→";
  margin: 0 16px;
  color: #d1d5db;
}

.tb-progress-step.completed:not(:last-child)::after {
  color: #059669;
}

/* Champs de paiement stylisés */
.woocommerce-checkout #payment .form-row {
  margin-bottom: 16px;
}

.woocommerce-checkout #payment .form-row input[type="text"],
.woocommerce-checkout #payment .form-row input[type="email"],
.woocommerce-checkout #payment .form-row input[type="tel"],
.woocommerce-checkout #payment .form-row select {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid #e5e7eb;
  border-radius: 8px;
  font-size: 16px;
  transition: border-color 0.3s ease;
}

.woocommerce-checkout #payment .form-row input:focus,
.woocommerce-checkout #payment .form-row select:focus {
  outline: none;
  border-color: #6b21a8;
  box-shadow: 0 0 0 3px rgba(107, 33, 168, 0.1);
}

/* Résumé de commande amélioré */
.woocommerce-checkout-review-order-table {
  width: 100%;
  border-collapse: collapse;
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
  padding: 12px 0;
  border-bottom: 1px solid #f3f4f6;
}

.woocommerce-checkout-review-order-table .order-total {
  font-weight: 700;
  font-size: 18px;
  color: #1f2937;
}

/* Styles Bootstrap pour les boutons */
.btn {
    display: inline-block;
    padding: 12px 24px;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-lg {
    padding: 16px 32px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 12px;
}

.btn-warning {
    color: #1a1a1a;
    background-color: #ffd60a;
    border-color: #ffd60a;
    box-shadow: 0 4px 12px rgba(255, 214, 10, 0.3);
}

.btn-warning:hover {
    color: #1a1a1a;
    background-color: #ffd60a;
    border-color: #ffd60a;
    filter: brightness(0.95);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(255, 214, 10, 0.4);
}

.w-100 {
    width: 100% !important;
}

/* Responsive */
@media (max-width: 768px) {
    .woocommerce form .form-row-first,
    .woocommerce form .form-row-last {
        width: 100%;
        display: block;
    }
    
    .tb-checkout-progress {
        flex-direction: column;
        gap: 8px;
    }
    
    .tb-progress-step:not(:last-child)::after {
        content: "↓";
        margin: 4px 0;
    }
}