/* ==========================================================================
   Checkout Component Styles
   ========================================================================== */

.co-card {
          background: #fff; border: 1px solid #e5e7eb;
          border-radius: 14px; padding: 20px 24px; margin-bottom: 20px;
        }
        .co-card-title {
          font-size: 12px; font-weight: 700; color: #6b7280;
          text-transform: uppercase; letter-spacing: 0.6px;
          margin-bottom: 16px; display: flex; align-items: center; gap: 7px;
        }
        .co-radio-option {
          display: flex; align-items: flex-start; gap: 12px;
          padding: 14px 18px; border: 1.5px solid #e5e7eb;
          border-radius: 12px; margin-bottom: 10px;
          cursor: pointer; transition: all 0.15s; background: #fff;
        }
        .co-radio-option.active { border-color: #16a34a; background: #f0fdf4; }
        .co-radio-option input[type=radio] {
          margin-top: 2px; flex-shrink: 0;
          accent-color: #16a34a; width: 16px; height: 16px;
        }
        .co-radio-label { font-size: 13.5px; font-weight: 700; color: #111; }
        .co-radio-sub   { font-size: 12px; color: #9ca3af; margin-top: 3px; }
        .co-address-form {
          background: #fafafa; border: 1.5px solid #e5e7eb;
          border-radius: 12px; padding: 20px; margin-top: 4px;
        }
        .co-field-label {
          font-size: 12.5px; font-weight: 700; color: #374151;
          margin-bottom: 6px; display: block;
        }
        .co-field-label .req { color: #ef4444; margin-left: 2px; }
        .co-field-label .opt { color: #9ca3af; font-weight: 400; font-size: 11.5px; margin-left: 4px; }
        .co-saved-pill {
          display: inline-flex; align-items: center; gap: 5px;
          background: #d1fae5; color: #065f46; border-radius: 20px;
          font-size: 11px; font-weight: 700; padding: 3px 12px; margin-left: 8px;
        }
        .co-free-delivery-note {
          font-size: 12px; color: #6b7280; margin: 0 0 14px;
          background: #fff7ed; border: 1px solid #fed7aa;
          border-radius: 8px; padding: 8px 12px;
        }

/* Responsive checkout layout */
.checkout,
.checkout .container { min-width: 0; max-width: 100%; box-sizing: border-box; }
.checkout .co-card,
.checkout .co-address-form { min-width: 0; }
.checkout .co-radio-option > div { min-width: 0; overflow-wrap: anywhere; }
.checkout .co-radio-sub { overflow-wrap: anywhere; }
.checkout .co-address-form input,
.checkout .co-address-form select,
.checkout .co-address-form textarea { width: 100%; max-width: 100%; min-width: 0; }
.checkout .co-address-form .row > [class*="col-"] { min-width: 0; }

@media (max-width: 767px) {
  .checkout .co-card { padding: 18px; }
  .checkout .co-address-form { padding: 16px; }
  .checkout .co-radio-option { padding: 12px 14px; }
  .checkout [style*="position: sticky"] { position: static !important; top: auto !important; }
}

@media (max-width: 480px) {
  .checkout.py-80 { padding-top: 32px !important; padding-bottom: 40px !important; }
  .checkout .co-card { padding: 14px; border-radius: 12px; }
  .checkout .co-address-form { padding: 12px; }
  .checkout .co-saved-pill { margin-left: 4px; white-space: normal; }
  .checkout .co-radio-option { gap: 9px; padding: 11px; }
  .checkout .co-card-title { flex-wrap: wrap; }
  .checkout .co-address-form [style*="display: flex"] { flex-wrap: wrap; }
  .checkout .co-address-form button { max-width: 100%; }
}