.bundle-picker { color:#172237; }
.bundle-picker h3 { font-size:22px; font-weight:700; margin:0 0 6px; }
.bundle-picker .bundle-intro { color:#64748b; font-size:14px; margin:0 0 20px; }
.bundle-picker .bundle-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 0; border-bottom:1px solid #e8edf3; }
.bundle-picker .bundle-description { display:grid; gap:5px; min-width:0; }
.bundle-picker label { font-size:15px; font-weight:650; margin:0; overflow-wrap:anywhere; }
.bundle-picker .bundle-description>span { font-size:14px; font-weight:600; }
.bundle-picker small { color:#64748b; font-size:12px; font-weight:400; }
.bundle-picker .bundle-stepper { display:flex; flex-shrink:0; align-items:center; border:1px solid #cbd5e1; border-radius:12px; overflow:hidden; background:#fff; }
.bundle-picker .bundle-stepper button { width:40px; height:44px; border:0; background:#f4f7fb; color:#243553; font-size:23px; cursor:pointer; }
.bundle-picker .bundle-stepper input { display:block; width:48px; height:44px; min-width:0; padding:0; border:0; border-radius:0; text-align:center; background:#fff; color:#172237; font-size:16px; font-weight:650; appearance:textfield; -moz-appearance:textfield; }
.bundle-picker input::-webkit-inner-spin-button,.bundle-picker input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.bundle-picker button:disabled { opacity:.4; cursor:not-allowed; }
.bundle-picker .bundle-unavailable { background:#f8fafc; }
.bundle-picker .bundle-summary { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:22px 0; }
.bundle-picker .bundle-summary>span { color:#64748b; font-size:13px; }
.bundle-picker .bundle-summary strong { font-size:24px; text-align:right; }
.bundle-picker .bundle-submit { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:50px; padding:12px 20px; border:0; border-radius:12px; background:#172b4d; color:#fff; font-size:16px; font-weight:650; cursor:pointer; }
.bundle-picker .bundle-submit:hover:not(:disabled) { background:#24416f; }
.bundle-picker :is(input,button):focus-visible { outline:3px solid #739fe8; outline-offset:-3px; }
.bundle-picker .bundle-error { display:flex; justify-content:space-between; gap:12px; margin-bottom:16px; padding:12px; border:1px solid #fecaca; border-radius:10px; color:#991b1b; background:#fff1f2; font-size:14px; }
.bundle-picker .bundle-error[hidden] { display:none; }
.bundle-picker .bundle-error button { border:0; background:transparent; color:inherit; font-size:22px; cursor:pointer; }
@media(max-width:380px) { .bundle-picker .bundle-row { flex-wrap:wrap; } .bundle-picker .bundle-stepper { margin-left:auto; } }
.bundle-picker .bundle-row { display:grid; grid-template-columns:64px minmax(0,1fr) auto; gap:12px 16px; }
.bundle-picker .bundle-photo { width:64px; height:64px; object-fit:contain; border:1px solid #e5eaf1; border-radius:10px; background:#fff; }
.bundle-picker .bundle-photo-empty { display:grid; place-content:center; color:#64748b; font-size:10px; text-align:center; }
.bundle-picker .bundle-line-total { grid-column:2/-1; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.bundle-picker .bundle-line-total strong { font-size:14px; }
@media(max-width:600px) {
  .bundle-picker .bundle-row { grid-template-columns:56px minmax(0,1fr); }
  .bundle-picker .bundle-photo { width:56px; height:56px; }
  .bundle-picker .bundle-stepper { grid-column:2; justify-self:start; margin:0; }
  .bundle-picker .bundle-line-total { grid-column:1/-1; }
  .bundle-picker .bundle-summary { flex-wrap:wrap; }
  .bundle-picker .bundle-summary strong { font-size:22px; }
}