/* ── WooCommerce Weight Price Display ─────────────────────────────────── */

/*
 * Hard reset — prevent themes from floating, absolutely positioning,
 * or transforming the wrapper (prevents the top-right overlap bug on some themes).
 */
.wc-wpd-wrapper,
.woocommerce div.product div.summary .wc-wpd-wrapper,
.woocommerce-page div.product div.summary .wc-wpd-wrapper,
.woocommerce ul.products li.product .wc-wpd-wrapper {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    float: none !important;
    clear: both;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    display: block;
    border-radius: 4px;
    /* margin, padding, border colour/width come from inline CSS (admin settings) */
}

/* ── Header text ──────────────────────────────────────────────────────── */

.wc-wpd-header {
    text-align: left;
    margin-bottom: 8px;
    font-weight: 600;
    font-size: 13px;
    color: inherit;
    line-height: 1.4;
}

/* ── Item row ─────────────────────────────────────────────────────────── */

.wc-wpd-items {
    display: flex;
    justify-content: space-evenly;
    align-items: flex-start;
    flex-wrap: nowrap;
    width: 100%;
}

.wc-wpd-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    flex: 1 1 0;
    min-width: 0;
    /* padding comes from inline CSS (admin settings) */
    box-sizing: border-box;
}

/* Item divider — colour/width/toggle comes from inline CSS (admin settings) */
.wc-wpd-item + .wc-wpd-item {
    border-left: 1px solid #e0e0e0;
}

/* ── Text ─────────────────────────────────────────────────────────────── */

.wc-wpd-label {
    display: block;
    font-size: 14px;
    margin-bottom: 3px;
    color: inherit;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    line-height: 1.3;
    /* font-weight, style, decoration, colour overridden by inline CSS from settings */
}

.wc-wpd-price {
    display: block;
    font-size: 14px;
    color: inherit;
    white-space: nowrap;
    line-height: 1.3;
}

/* Strip WooCommerce's default price colour/size so our settings take effect */
.wc-wpd-price .woocommerce-Price-amount,
.wc-wpd-price bdi {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
}

/* ── Responsive ───────────────────────────────────────────────────────── */

/* Tablet (≤ 768 px) */
@media ( max-width: 768px ) {
    .wc-wpd-header {
        font-size: 12px;
    }

    .wc-wpd-label,
    .wc-wpd-price {
        font-size: 12px;
    }

    .wc-wpd-item {
        padding: 0 6px !important;
    }
}

/* Mobile (≤ 480 px) */
@media ( max-width: 480px ) {
    .wc-wpd-header {
        font-size: 11px;
    }

    .wc-wpd-label,
    .wc-wpd-price {
        font-size: 11px;
    }

    .wc-wpd-item {
        padding: 0 4px !important;
    }
}

/* Very narrow (≤ 320 px) — stack into a column, label + price side-by-side */
@media ( max-width: 320px ) {
    .wc-wpd-items {
        flex-direction: column;
        align-items: stretch;
    }

    .wc-wpd-item {
        flex-direction: row;
        justify-content: space-between;
        padding: 3px 0 !important;
        text-align: left;
    }

    .wc-wpd-item + .wc-wpd-item {
        border-left: none !important;
        border-top: 1px solid #e0e0e0;
    }

    .wc-wpd-label {
        margin-bottom: 0;
        margin-right: 8px;
    }
}