/* ============ MINI BARRE STICKY TOP (mobile) ============ */
.imwb-mini {
  display: none;
  position: sticky;
  top: 0;
  z-index: 49;
  background: #fff;
  padding: 8px 14px;
  border-bottom: 1px solid #e5ddc9;
  box-shadow: 0 2px 10px rgba(0,0,0,.08);
}
.imwb-mini-row { display: flex; align-items: center; gap: 10px; }
.imwb-mini-ico { font-size: 18px; flex-shrink: 0; }
.imwb-mini-track { flex: 1; height: 8px; background: #e5ddc9; border-radius: 6px; overflow: hidden; }
.imwb-mini-fill { height: 100%; transition: width .4s ease; border-radius: 6px; }
.imwb-mini-wtxt { font-size: 12px; font-weight: 800; min-width: 70px; text-align: right; color: #1a1a1a; }
.imwb-mini-msg { font-size: 11px; color: #6b6560; line-height: 1.3; margin-top: 4px; text-align: center; }
.imwb-mini-msg strong { color: #8b2635; font-weight: 800; }

/* Mobile */
@media (max-width: 768px) {
  .imwb-mini { display: block; }
  .imwb-wrap { display: none !important; }
}

/* ============ BARRE COMPLÈTE (desktop) ============ */
.imwb-wrap {
  background: #fff;
  border-radius: 14px;
  padding: 18px 20px;
  margin: 20px 0;
  border: 2px solid #e5ddc9;
  transition: border-color .3s, background .3s;
  box-shadow: 0 4px 20px rgba(0,0,0,.06);
  font-family: inherit;
}
.imwb-wrap[data-state="empty"] { border-color: #e5ddc9; }
.imwb-wrap[data-state="sousrempli"] { border-color: #d97706; background: linear-gradient(135deg, #fff, #fef3c7); }
.imwb-wrap[data-state="optimal"] { border-color: #4a7c3f; background: linear-gradient(135deg, #fff, #ecfdf5); }
.imwb-wrap[data-state="limite"] { border-color: #4a7c3f; background: linear-gradient(135deg, #fff, #d1fae5); animation: imwb-pulse 2s infinite; }
.imwb-wrap[data-state="depasse"] { border-color: #dc2626; background: linear-gradient(135deg, #fff, #fef2f2); }

@keyframes imwb-pulse {
  0%, 100% { box-shadow: 0 4px 20px rgba(74,124,63,.2); }
  50% { box-shadow: 0 4px 30px rgba(74,124,63,.5); }
}

.imwb-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; flex-wrap: wrap; gap: 10px; }
.imwb-title { font-size: 14px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; display: flex; gap: 8px; align-items: center; color: #1a1a1a; }
.imwb-ico { font-size: 20px; }
.imwb-weights { font-size: 20px; font-weight: 800; color: #1a1a1a; }
.imwb-max { color: #6b6560; font-size: 14px; font-weight: 600; }

.imwb-bar { background: #e5ddc9; height: 14px; border-radius: 10px; overflow: hidden; position: relative; margin-bottom: 10px; }
.imwb-fill { height: 100%; transition: width .4s ease; border-radius: 10px; }
.imwb-fill-empty { background: #ddd; }
.imwb-fill-sousrempli { background: linear-gradient(90deg, #f59e0b, #d97706); }
.imwb-fill-optimal { background: linear-gradient(90deg, #4ade80, #16a34a); }
.imwb-fill-limite { background: linear-gradient(90deg, #16a34a, #15803d); }
.imwb-fill-depasse { background: linear-gradient(90deg, #ef4444, #b91c1c); }
.imwb-carton { position: absolute; right: 4%; top: 50%; transform: translateY(-50%); font-size: 10px; color: #6b6560; background: rgba(255,255,255,.9); padding: 1px 6px; border-radius: 8px; font-weight: 700; }

.imwb-msg { font-size: 14px; line-height: 1.5; margin-bottom: 10px; color: #1a1a1a; }
.imwb-msg strong { color: #8b2635; font-weight: 800; }
.imwb-msg .imwb-ok { color: #4a7c3f; font-weight: 800; }

.imwb-switch-notice { background: linear-gradient(135deg, #fef3c7, #fde68a); border: 1px solid #d97706; border-radius: 8px; padding: 10px 14px; margin-bottom: 12px; font-size: 13px; color: #78350f; }
.imwb-switch-notice strong { color: #8b2635; }
.imwb-carrier-badge { display: inline-block; margin-top: 10px; padding: 4px 12px; background: #faf5e6; border: 1px solid #c9a66b; border-radius: 12px; font-size: 11px; color: #6b6560; font-weight: 700; letter-spacing: 1px; }
.imwb-tiers { display: flex; gap: 8px; margin-top: 10px; font-size: 11px; }
.imwb-tier { flex: 1; padding: 8px 10px; background: #fff; border: 1px solid #e5ddc9; border-radius: 8px; text-align: center; min-width: 70px; }
.imwb-tier.active { background: #c9a66b; color: #000; border-color: #c9a66b; font-weight: 800; }
.imwb-tier-range { font-weight: 700; font-size: 11px; }
.imwb-tier-price { font-size: 12px; color: #6b6560; margin-top: 2px; }
.imwb-tier.active .imwb-tier-price { color: #000; }

.imwb-sugg { margin-top: 14px; padding-top: 14px; border-top: 1px dashed #e5ddc9; }
.imwb-sugg-title { font-size: 11px; color: #6b6560; margin-bottom: 8px; letter-spacing: 1px; text-transform: uppercase; font-weight: 700; }
.imwb-sugg-list { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.imwb-sugg-item { flex: 0 0 110px; background: #fff; border: 1px solid #e5ddc9; border-radius: 8px; padding: 8px; text-align: center; transition: all .15s; text-decoration: none; color: inherit; }
.imwb-sugg-item:hover { border-color: #c9a66b; transform: translateY(-2px); text-decoration: none; }
.imwb-sugg-ph { height: 60px; background: #faf5e6; border-radius: 4px; margin-bottom: 4px; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.imwb-sugg-ph img { max-width: 100%; max-height: 100%; object-fit: contain; }
.imwb-sugg-n { font-size: 10px; font-weight: 700; min-height: 24px; line-height: 1.2; }
.imwb-sugg-w { font-size: 10px; color: #6b6560; margin-top: 2px; }
.imwb-sugg-pr { font-size: 11px; font-weight: 800; color: #8b2635; margin-top: 2px; }
