/**
 * Miratti × MFL Collection — WooCommerce Checkout Custom Styles
 * 
 * À ajouter via :
 *   wp_enqueue_style('miratti-checkout', get_stylesheet_directory_uri() . '/assets/css/miratti-checkout-style.css');
 *   dans functions.php (uniquement sur is_checkout())
 *
 * Principe : On ne touche PAS au spacing/layout WooCommerce.
 * On change uniquement : background, fonts, couleurs, inputs styling.
 */

/* ── Google Fonts import ── */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');

/* ══════════════════════════════════════
   1. PAGE BACKGROUND & GLOBAL
   ══════════════════════════════════════ */
body.woocommerce-checkout {
  background-color: #0a0a0a !important;
  color: #f2f2f2 !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* ══════════════════════════════════════
   2. TYPOGRAPHY
   ══════════════════════════════════════ */
.woocommerce-checkout h1,
.woocommerce-checkout h2,
.woocommerce-checkout h3,
.woocommerce-checkout h4,
.woocommerce-checkout h5,
.woocommerce-checkout h6 {
  font-family: 'Bebas Neue', 'Montserrat', sans-serif !important;
  color: #f2f2f2 !important;
  letter-spacing: 0.05em;
}

.woocommerce-checkout p,
.woocommerce-checkout label,
.woocommerce-checkout span,
.woocommerce-checkout td,
.woocommerce-checkout th,
.woocommerce-checkout li,
.woocommerce-checkout a {
  font-family: 'Montserrat', sans-serif !important;
}

.woocommerce-checkout label {
  color: #a0a0a0 !important;
  font-weight: 500 !important;
  font-size: 0.85rem !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ══════════════════════════════════════
   3. FORM INPUTS & SELECT
   ══════════════════════════════════════ */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="number"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout textarea,
.woocommerce-checkout select,
.woocommerce-checkout .select2-container--default .select2-selection--single {
  background-color: #121212 !important;
  border: 1px solid #2a2a2a !important;
  color: #f2f2f2 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 0.95rem !important;
  border-radius: 8px !important;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.woocommerce-checkout input:focus,
.woocommerce-checkout textarea:focus,
.woocommerce-checkout select:focus {
  border-color: #15803d !important;
  box-shadow: 0 0 0 2px rgba(21, 128, 61, 0.15) !important;
  outline: none !important;
}

/* Select2 dropdown (country/state selectors) */
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #f2f2f2 !important;
  font-family: 'Montserrat', sans-serif !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #666 transparent transparent transparent !important;
}

.select2-dropdown {
  background-color: #1a1a1a !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 8px !important;
}

.select2-results__option {
  color: #f2f2f2 !important;
  font-family: 'Montserrat', sans-serif !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: #15803d !important;
  color: #fff !important;
}

/* Placeholder */
.woocommerce-checkout ::placeholder {
  color: #555 !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* ══════════════════════════════════════
   4. ORDER REVIEW TABLE
   ══════════════════════════════════════ */
.woocommerce-checkout-review-order-table {
  background-color: #111111 !important;
  border: 1px solid #1e1e1e !important;
  border-radius: 12px !important;
  overflow: hidden;
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
  color: #e0e0e0 !important;
  border-bottom: 1px solid #1e1e1e !important;
  font-family: 'Montserrat', sans-serif !important;
}

.woocommerce-checkout-review-order-table thead th {
  color: #888 !important;
  text-transform: uppercase;
  font-size: 0.8rem !important;
  letter-spacing: 0.05em;
}

.woocommerce-checkout-review-order-table .order-total td,
.woocommerce-checkout-review-order-table .order-total th {
  color: #f2f2f2 !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
}

.woocommerce-checkout-review-order-table .order-total .woocommerce-Price-amount {
  color: #22c55e !important;
  font-weight: 800 !important;
}

/* ══════════════════════════════════════
   5. PAYMENT METHODS
   ══════════════════════════════════════ */
.woocommerce-checkout-payment {
  background-color: #111111 !important;
  border: 1px solid #1e1e1e !important;
  border-radius: 12px !important;
}

.woocommerce-checkout-payment ul.payment_methods {
  border-bottom: 1px solid #1e1e1e !important;
}

.woocommerce-checkout-payment ul.payment_methods li {
  color: #e0e0e0 !important;
}

.woocommerce-checkout-payment ul.payment_methods li label {
  color: #e0e0e0 !important;
}

.woocommerce-checkout-payment .payment_box {
  background-color: #0d0d0d !important;
  color: #999 !important;
}

.woocommerce-checkout-payment .payment_box::before {
  border-bottom-color: #0d0d0d !important;
}

/* ══════════════════════════════════════
   6. PLACE ORDER BUTTON
   ══════════════════════════════════════ */
#place_order {
  background: linear-gradient(135deg, #166534, #15803d, #22c55e) !important;
  color: #fff !important;
  font-family: 'Bebas Neue', 'Montserrat', sans-serif !important;
  font-size: 1.2rem !important;
  letter-spacing: 0.08em;
  border: none !important;
  border-radius: 10px !important;
  cursor: pointer;
  transition: all 0.3s ease !important;
  text-transform: uppercase;
}

#place_order:hover {
  box-shadow: 0 0 30px -5px rgba(34, 197, 94, 0.4) !important;
  transform: translateY(-1px);
}

/* ══════════════════════════════════════
   7. NOTICES & MESSAGES
   ══════════════════════════════════════ */
.woocommerce-checkout .woocommerce-error,
.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-info {
  background-color: #1a1a1a !important;
  border-top-color: #15803d !important;
  color: #e0e0e0 !important;
  font-family: 'Montserrat', sans-serif !important;
  border-radius: 8px !important;
}

.woocommerce-checkout .woocommerce-error {
  border-top-color: #dc2626 !important;
}

/* ══════════════════════════════════════
   8. LINKS
   ══════════════════════════════════════ */
.woocommerce-checkout a {
  color: #22c55e !important;
  transition: color 0.2s ease;
}

.woocommerce-checkout a:hover {
  color: #4ade80 !important;
}

/* ══════════════════════════════════════
   9. COUPON / LOGIN TOGGLE BARS
   ══════════════════════════════════════ */
.woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-form-login-toggle .woocommerce-info {
  background-color: #111 !important;
  border: 1px solid #1e1e1e !important;
  border-radius: 8px !important;
  color: #ccc !important;
}

.woocommerce-checkout .checkout_coupon {
  background-color: #111 !important;
  border: 1px solid #1e1e1e !important;
  border-radius: 8px !important;
}

/* ══════════════════════════════════════
   10. CHECKBOX & RADIO CUSTOM STYLE
   ══════════════════════════════════════ */
.woocommerce-checkout input[type="checkbox"],
.woocommerce-checkout input[type="radio"] {
  accent-color: #15803d !important;
}

/* ══════════════════════════════════════
   11. RESPONSIVE TWEAKS (optional)
   ══════════════════════════════════════ */
@media (max-width: 768px) {
  .woocommerce-checkout h3 {
    font-size: 1.4rem !important;
  }
}
