/* Scoped presentation only: no cart controls, totals or prices are modified. */
#bio-five-progress {
    --bio-five-accent: #155e63;
    box-sizing: border-box;
    margin: 12px 16px;
    padding: 15px 16px;
    border: 1px solid #dde6e5;
    border-radius: 14px;
    background: #f7fafb;
    color: #18262a;
    font-family: inherit;
    text-align: start;
    flex-shrink: 0;
    overflow-wrap: anywhere;
}
#bio-five-progress[hidden], #bio-five-progress [hidden] { display: none !important; }
#bio-five-progress * { box-sizing: border-box; }
#bio-five-progress .bio-five-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
#bio-five-progress .bio-five-title { font-size: 14px; line-height: 1.35; font-weight: 750; letter-spacing: .025em; }
#bio-five-progress .bio-five-count { font-size: 12px; line-height: 1.2; white-space: nowrap; font-weight: 700; padding: 5px 8px; border-radius: 7px; background: #e8efef; }
#bio-five-progress p { padding: 0; }
#bio-five-progress .bio-five-description { font-size: 13px; line-height: 1.5; margin: 9px 0 12px; }
#bio-five-progress .bio-five-meter { height: 9px; width: 100%; overflow: hidden; border-radius: 50px; background: #dfe7e9; }
#bio-five-progress .bio-five-fill { display: block; height: 100%; border-radius: inherit; background: var(--bio-five-accent); transition: width 250ms ease; }
#bio-five-progress .bio-five-message { margin: 11px 0 7px; font-size: 13px; line-height: 1.5; font-weight: 600; }
#bio-five-progress .bio-five-terms { margin: 0; font-size: 11px; line-height: 1.45; color: #536267; }
#bio-five-progress .bio-five-preview { font-size: 10px; line-height: 1.4; padding: 5px 7px; background: #fff2cf; color: #563e00; border-radius: 4px; margin-bottom: 9px; font-weight: 700; }
/* Celebration marks completion of the eligible-pack selection, NOT verified savings. */
#bio-five-progress.bio-five-complete {
    background: radial-gradient(ellipse at 100% 0%, #fff6da 0%, transparent 58%), linear-gradient(130deg, #f0f9f5, #fffdf6);
    border-color: #c9dcd2;
    box-shadow: 0 2px 10px rgba(21, 70, 51, .04);
}
#bio-five-progress.bio-five-complete .bio-five-count { background: #dceee2; color: #164c38; }
#bio-five-progress.bio-five-complete .bio-five-meter { margin-top: 13px; }
#bio-five-progress .bio-five-celebration { display: flex; gap: 10px; align-items: center; margin-top: 15px; }
#bio-five-progress .bio-five-success-icon { display: flex; color: #88611d; flex: 0 0 38px; }
#bio-five-progress .bio-five-success-icon svg { display: block; width: 38px; height: 38px; }
#bio-five-progress .bio-five-success-text { min-width: 0; }
#bio-five-progress .bio-five-complete-label { display: block; color: #636044; font-size: 9px; line-height: 1.4; letter-spacing: .11em; font-weight: 700; margin-bottom: 3px; }
#bio-five-progress .bio-five-complete-title { display: block; color: #193c2e; font-size: 20px; line-height: 1.2; font-weight: 750; letter-spacing: -.02em; }
#bio-five-progress.bio-five-complete .bio-five-message { color: #193c2e; margin: 9px 0 7px; font-size: 14px; line-height: 1.45; }
#bio-five-progress .bio-five-verification { color: #485a50; font-size: 12px; line-height: 1.45; margin: 0 0 10px; font-weight: 400; }
#bio-five-progress.bio-five-complete .bio-five-terms { border-top: 1px solid #dce7dc; padding-top: 9px; }
@media (max-width: 380px) {
    #bio-five-progress { margin: 10px; padding: 12px; }
    #bio-five-progress .bio-five-complete-title { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) { #bio-five-progress .bio-five-fill { transition: none; } }

/* Diagnostics are populated only for the administrator-only Preview mode. */
#bio-five-progress .bio-five-debug { margin:12px 0 0; padding:10px; border:1px dashed currentColor; border-radius:6px; font-size:11px; line-height:1.5; text-align:left; }
#bio-five-progress .bio-five-debug summary { cursor:pointer; font-weight:700; }
#bio-five-progress .bio-five-debug p { margin:8px 0; }
#bio-five-progress .bio-five-debug ul { margin:6px 0 0; padding:0 0 0 16px; }
#bio-five-progress .bio-five-debug li { margin:0 0 7px; overflow-wrap:anywhere; }
