:root {
    --fvce-green: #146b3a;
    --fvce-green-2: #2f9c5a;
    --fvce-green-soft: #eaf5ee;
    --fvce-ink: #173226;
    --fvce-muted: #66766d;
    --fvce-line: #dce8e0;
    --fvce-card: #ffffff;
}

.fvce-carton-engine-root {
    margin: 0 0 24px;
    min-height: var(--fvce-carton-engine-min-height, 0);
}

.fvce-carton-engine-placeholder {
    min-height: var(--fvce-carton-engine-min-height, 160px);
}

.fvce-cart-summary {
    border: 1px solid var(--fvce-line);
    border-radius: 18px;
    background: linear-gradient(145deg, #fff 0%, #f8fbf9 100%);
    box-shadow: 0 14px 42px rgba(20, 62, 39, .08);
    overflow: hidden;
    color: var(--fvce-ink);
}

.fvce-cart-summary__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 24px 16px;
    border-bottom: 1px solid var(--fvce-line);
}

.fvce-cart-summary__eyebrow {
    margin: 0 0 4px;
    color: var(--fvce-green);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.fvce-cart-summary h2 {
    margin: 0;
    color: var(--fvce-ink);
    font-size: clamp(18px, 2vw, 24px);
    line-height: 1.2;
}

.fvce-cart-summary__live {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    border-radius: 999px;
    background: var(--fvce-green-soft);
    color: var(--fvce-green);
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.fvce-cart-summary__live::before {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--fvce-green-2);
    content: "";
    box-shadow: 0 0 0 4px rgba(47, 156, 90, .12);
}

.fvce-cart-summary__intro {
    padding: 14px 24px 0;
    color: var(--fvce-muted);
}

.fvce-cart-summary__intro p { margin: 0; }

.fvce-packages {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(275px, 1fr));
    gap: 16px;
    padding: 18px 24px 24px;
}

.fvce-package-card {
    position: relative;
    min-width: 0;
    border: 1px solid var(--fvce-line);
    border-radius: 15px;
    background: var(--fvce-card);
    padding: 16px;
    box-shadow: 0 8px 22px rgba(26, 78, 49, .06);
}

.fvce-package-card__topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.fvce-package-card__number {
    color: var(--fvce-muted);
    font-size: 13px;
    font-weight: 700;
}

.fvce-package-card__format {
    padding: 4px 9px;
    border-radius: 999px;
    background: var(--fvce-green);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}

.fvce-package-card__content {
    display: grid;
    grid-template-columns: minmax(125px, .8fr) minmax(145px, 1.2fr);
    align-items: center;
    gap: 18px;
}

.fvce-package-card__details h3 {
    margin: 0 0 4px;
    font-size: 18px;
    color: var(--fvce-ink);
}

.fvce-package-card__dimensions {
    margin: 0 0 13px;
    color: var(--fvce-muted);
    font-size: 12px;
}

.fvce-progress {
    position: relative;
    height: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: #e7ece9;
}

.fvce-progress span {
    display: block;
    height: 100%;
    min-width: 5px;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--fvce-green), var(--fvce-green-2));
    transition: width .38s ease;
}

.fvce-package-card__percentage {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    margin-top: 7px;
}

.fvce-package-card__percentage strong {
    color: var(--fvce-green);
    font-size: 15px;
}

.fvce-package-card__percentage span {
    color: var(--fvce-muted);
    font-size: 11px;
}

.fvce-package-card__message {
    margin: 12px 0 0;
    color: var(--fvce-ink);
    font-size: 13px;
    line-height: 1.45;
}

.fvce-package-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 160px);
    aspect-ratio: 3 / 2;
    margin: 0 auto;
}

.fvce-package-visual__image {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.fvce-cart-summary__footer {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    border-top: 1px solid var(--fvce-line);
    background: var(--fvce-green-soft);
    color: #456456;
    font-size: 12px;
}

.fvce-cart-summary__footer span {
    color: var(--fvce-green);
    font-size: 17px;
}

@media (max-width: 760px) {
    .fvce-cart-summary__header {
        flex-direction: column;
        padding: 18px;
    }

    .fvce-cart-summary__intro { padding: 13px 18px 0; }
    .fvce-packages { grid-template-columns: 1fr; padding: 16px 18px 18px; }
    .fvce-package-card__content { grid-template-columns: 1fr; text-align: center; }
    .fvce-package-visual { width: min(100%, 180px); }
    .fvce-package-card__percentage { justify-content: center; }
    .fvce-cart-summary__footer { padding: 12px 18px; }
}

.fvce-package-card__percentage.is-full strong,
.fvce-package-card__percentage.is-full span {
    color: var(--fvce-green);
    font-weight: 900;
}
.fvce-cart-summary.is-compact .fvce-cart-summary__header { padding:16px 18px 12px; }
.fvce-cart-summary.is-compact .fvce-cart-summary__intro { padding:10px 18px 0; }
.fvce-cart-summary.is-compact .fvce-packages { padding:14px 18px 18px; }
.fvce-cart-summary.is-compact .fvce-package-card { padding:13px; }

/* UX publique consolidée — colis lisibles et condensés */
.fvce-package-card.is-complete {
    border-color: #cfe3d6;
}

.fvce-package-card__status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 11px;
    font-size: 14px;
}

.fvce-package-card__status.is-complete {
    background: var(--fvce-green-soft);
    color: var(--fvce-green);
}

.fvce-package-card__status.is-complete span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 21px;
    height: 21px;
    border-radius: 50%;
    background: var(--fvce-green);
    color: #fff;
    font-size: 13px;
    font-weight: 900;
}

.fvce-package-card__status strong {
    font-weight: 900;
}

.fvce-packages.is-condensed {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 760px) {
    .fvce-packages.is-condensed {
        grid-template-columns: 1fr;
    }
}
