
.ccw{max-width:960px;margin:24px auto;padding:16px;border:1px solid #e5e7eb;border-radius:16px;background:#fff;box-shadow:0 6px 24px rgba(0,0,0,.04)}
.ccw-pane{animation:fade .2s ease}
.ccw-hide{display:none}
.ccw-field{margin-bottom:14px}
.ccw-field label{display:block;font-weight:700;margin-bottom:6px}
/* 3-col grid for colors (keeps on mobile) */
.ccw-colors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ccw-color{border:2px solid #e5e7eb;border-radius:14px;overflow:hidden;cursor:pointer;background:#fff;width:100%}
.ccw-color img{width:100%;height:clamp(72px,26vw,140px);object-fit:cover;display:block}
.ccw-color-name{padding:8px 10px;font-weight:700;color:#111827}
.ccw-color.ccw-on{background:#0f172a;border-color:#0f172a}
.ccw-color.ccw-on .ccw-color-name{color:#fff}
/* Motor pills */
.ccw-pills{display:flex;gap:8px;flex-wrap:wrap}
.ccw-pill{border:1px solid #e5e7eb;background:#f7f8fa;border-radius:999px;padding:8px 12px;cursor:pointer}
.ccw-pill.ccw-on{background:#0f172a;color:#fff;border-color:#0f172a}
/* Inputs/selects */
.ccw input[type="text"], .ccw input[type="tel"], .ccw textarea{width:100%;border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;background:#f7faff;color:#111827;line-height:1.4;min-height:44px}
.ccw select{width:100%;border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;background:#fff;color:#111827;line-height:1.4;min-height:44px;height:auto}
.ccw option{color:#111827}
/* Payment list */
.ccw-sec{font-weight:800;margin:10px 0 6px;display:block}
.ccw-pay{margin-bottom:8px}
.ccw-choice{display:flex;align-items:center;border:1px solid #e5e7eb;border-radius:12px;padding:8px 10px;background:#fff;margin-bottom:8px;cursor:pointer;gap:0}
.ccw-choice input{margin-right:10px}
.ccw-choice img{width:40px;height:40px;object-fit:contain;margin-right:10px}
/* Summary + actions */
.ccw-summary{margin:10px 0;padding:12px;border:1px dashed #cbd5e1;border-radius:10px;background:#f9fafb;font-size:14px;line-height:1.5}
.ccw-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}
.ccw-actions button{background:#0f172a;color:#fff;border:none;border-radius:10px;padding:10px 14px;cursor:pointer}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.ccw-hidden{display:none !important}

/* === CCW FINAL UI (v6.3.0) === */
:root { --ccw-primary: #8B0000; }
.ccw, .ccw-embed, .ccw .ccw-card, .ccw .ccw-inner,
.ccw .card, .ccw .panel, .ccw .box {
  border: none !important;
  box-shadow: none !important;
}
.ccw-pane > h3 { display: none !important; }
.ccw-actions button.ccw-submit {
  width: 100% !important;
  text-align: center !important;
  background: var(--ccw-primary) !important;
  border-radius: 12px !important;
  padding: 12px 16px !important;
  color: #fff !important;
}

/* Added padding-bottom for sticky button space */
.custom-checkout-form-container { padding-bottom: 100px !important; }

/* Sticky safe area padding for canvas */
.ccw { padding-bottom: 60px !important; }
@supports (padding-bottom: env(safe-area-inset-bottom)) {
.ccw { padding-bottom: 60px !important; }
}
