/*
 * CPG: Selector Comuna/Envío — Estilos
 * Version: 1.0.26
 * Movido desde PHP inline a archivo externo para caché de navegador/CDN
 */

:root {
    --cpg-border:        #e1d2d2;
    --cpg-radius:        15px;
    --cpg-shadow:        0 8px 32px rgba(0,0,0,.18);
    --cpg-transition:    .2s ease;
}

/* ═══════════════════════════════════════
   BOTÓN HEADER
═══════════════════════════════════════ */
.whb-general-header.whb-flex-flex-middle .whb-col-center {
    flex: 1;
}
.whb-general-header.whb-flex-flex-middle .wd-header-text {
    flex: none;
        padding: 0;
}
.cpg-h-header__comuna-selector {
    position: relative;
}

button.cpg-comuna-btn {
    display:  flex;
    align-items: center;
    gap: 6px;
    background: transparent;
    border-radius: 20px;
    color: #fff;
    background: var(--cpg-red);
    text-transform: none;
    cursor: pointer;
        font-family: var(--cpg-title-font) !important;
    font-size: .875rem;
    line-height: 1;
    padding: 14px 16px 14px 16px;
    transition: .3s cubic-bezier(.68, -.6, .32, 1.6);;
    white-space: nowrap;
    -webkit-appearance: none;
}

button.cpg-comuna-btn:hover,
button.cpg-comuna-btn:focus-visible {
    background: var(--cpg-red);
    transform: scale(1.022);
    color:       #fff;
    outline:     none;
}
.cpg-pin-icon    { flex-shrink:0; height:19px; width:19px; }
.cpg-chevron-icon {
    flex-shrink:0; height:12px; width:12px;
    transition: transform var(--cpg-transition);
}
.cpg-comuna-btn[aria-expanded="true"] .cpg-chevron-icon { transform: rotate(180deg); }

button.cpg-comuna-btn .cpg-comuna-label-wrap {
    color: #fff;
}

/* ── Eyebrow "Enviaremos a:" + label de comuna ── */
.cpg-comuna-label-wrap {
    display:        flex;
    flex-direction: column;
    align-items:    flex-start;
    line-height:    1.1;
    gap:            1px;
    color: var(--cpg-color-text);
}
.cpg-comuna-eyebrow {
    font-size:      0.67rem;
    opacity:        0.82;
    white-space:    nowrap;
}
/* Cuando hay selección el label del botón tiene max-width — movemos la regla al wrap */
.cpg-comuna-btn.cpg-has-selection .cpg-comuna-label-wrap {
    max-width: 120px;
    color: #fff;
    overflow: hidden;
}
.cpg-comuna-btn.cpg-has-selection #cpg-comuna-label,
.cpg-comuna-btn.cpg-has-selection [data-cpg-comuna-label] {
        padding-bottom: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}
.cpg-comuna-btn--drawer-prompt.cpg-has-selection [data-cpg-comuna-label],.cpg-comuna-btn.cpg-comuna-btn--drawer-prompt.cpg-has-selection .cpg-comuna-label-wrap {
        color: var(--cpg-color-text) !important;
}
/* ═══════════════════════════════════════
   TOOLTIP
═══════════════════════════════════════ */
.cpg-tooltip {
    background:    #fff;
    border-radius: var(--cpg-radius);
    box-shadow:    rgb(191 119 98 / 78%) 0 5px 34px -15px;
    padding:       18px 18px 14px;
    position:      absolute;
    top:           calc(100% + 12px);
    left:          50%;
    transform:     translateX(-50%);
    width:         260px;
    z-index:       99999;

    opacity:    0;
    pointer-events: none;
    transition: opacity .25s ease, transform .25s ease;
    transform:  translateX(-50%) translateY(-6px);
}

.cpg-tooltip::before {
    content:      '';
    border:       7px solid transparent;
    border-bottom-color: #fff;
    height:       0; width: 0;
    position:     absolute;
    top:          -14px;
    left:         50%;
    transform:    translateX(-50%);
    filter:       drop-shadow(0 -2px 2px rgba(0,0,0,.08));
}

.cpg-tooltip.cpg-tooltip-visible {
    opacity:        0;
    pointer-events: auto;
    transform:      translateX(-50%) translateY(0);
}

/* Botón X del tooltip */
button.cpg-tooltip-close {
    background:  transparent;
    border:      none;
    color:       var(--cdpg-color-text);
    cursor:      pointer;
    display:     flex;
    align-items: center;
    justify-content: center;
    height:      28px; width: 28px;
    padding:     0;
    position:    absolute;
    right:       8px; top: 8px;
    border-radius: 50%;
    transition:  background var(--cpg-transition);
    -webkit-appearance: none;
}
.cpg-tooltip-close svg { height:14px; width:14px; }
button.cpg-tooltip-close:hover { background: #f0f0f0; }

/* Texto del tooltip */
.cpg-tooltip-text {
    color:       var(--cpg-color-text);
    font-size:   .875rem;
    line-height: 1.45;
    margin:      0 0 12px;
    padding-right: 20px;
}

/* Botón CTA del tooltip */
button.cpg-tooltip-cta {
        font-family: var(--cpg-title-font);
    background:    var(--cpg-success-border);
    border:        none;
        text-transform: none;
    border-radius: var(--cpg-border-radius-s);
    color:         #fff;
    cursor:        pointer;
    display:       block;
    font-family:   inherit;
    font-size:     .875rem;
    padding:       10px 16px;
    text-align:    center;
    transition:    background var(--cpg-transition);
    width:         100%;
    -webkit-appearance: none;
}
button.cpg-tooltip-cta:hover { background: var(--cpg-success-color);    color: #fff; }

/* ═══════════════════════════════════════
   OVERLAY MODAL
═══════════════════════════════════════ */
.cpg-modal-overlay {
    align-items:     center;
    background:      rgb(91 82 82 / 65%);
    bottom:0; left:0; right:0; top:0;
    display:         flex;
    justify-content: center;
    padding:         16px;
    position:        fixed;
    z-index:         9999999999;
    animation:       cpgFadeIn .2s ease forwards;
}
.cpg-modal-overlay[hidden] { display: none; }

@keyframes cpgFadeIn { from{opacity:0} to{opacity:1} }

/* ═══════════════════════════════════════
   CONTENEDOR MODAL
═══════════════════════════════════════ */
.cpg-modal-container {
    background:    #fff;
    border-radius: 2.5rem;
    max-width:     480px;
    padding:       45px 40px 36px;
    position:      relative;
    width:         100%;
    animation:     cpgSlideUp .25s ease forwards;
}
@keyframes cpgSlideUp {
    from{opacity:0;transform:translateY(20px)}
    to{opacity:1;transform:translateY(0)}
}

/* Botón X */
button.cpg-modal-close {
    align-items:    center;
    background:     transparent;
    border:         none;
    border-radius:  99px;
    cursor:         pointer;
    display:        flex;
    height:36px; width:36px;
    justify-content:center;
    padding:0;
    position:absolute; right:14px; top:14px;
    transition: background var(--cpg-transition);
    -webkit-appearance: none;
}
.cpg-modal-close svg { height:18px; width:18px; }
button.cpg-modal-close:hover { background:var(--cpg-cream); }

.cpg-modal-title {
    font-size:   1.35rem;
    line-height: 1.2;
    margin:      0 0 10px;
    letter-spacing: -.04rem;
}
#cpg-delivery-info-title {
    font-size:   1.6rem;
}
.cpg-modal-subtitle {
    font-size:   .875rem;
    line-height: 1.5;
    margin:      0 0 24px;
}

/* ═══════════════════════════════════════
   FORMULARIO MODAL
═══════════════════════════════════════ */
.cpg-modal-form .form-row { margin-bottom: 18px; }

.cpg-modal-form label {
    display: block;
    font-family: var(--cpg-title-font);
    font-size: 13px;
    margin-bottom:  2px;
}
.cpg-modal-form label .required {font-size:.75rem; margin-left:2px; }
.cpg-modal-form .woocommerce-input-wrapper { display:block; width:100%; }

.cpg-select {
    appearance:       none;
    -webkit-appearance: none;
    background:       #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 12px center;
    border:           1.5px solid var(--cpg-border);
    border-radius:    var(--cpg-radius)!important;
    color:            var(--cdpg-color-text);
    cursor:           pointer;
    display:          block;
    font-family:      inherit;
    font-size:        .9375rem;
    padding:          11px 38px 11px 14px;
    transition:       border-color var(--cpg-transition), box-shadow var(--cpg-transition);
    width:            100%;
}
.cpg-select:focus {
    outline:      none;
}
.cpg-select:disabled { background-color:#f5f5f5; color:#999; cursor:not-allowed; }
.cpg-select.cpg-select-error {
    border-color: var(--cpg-error-color);
    box-shadow:   0 0 0 3px rgba(198,40,40,.12);
}

.cpg-field-error {
    color:      var(--cpg-error-color);
    display:    block;
    font-size:  .8rem;
    margin-top: 5px;
}

.cpg-field-error[hidden] { display: none; }

/* ═══════════════════════════════════════
   BOTONES DEL MODAL
═══════════════════════════════════════ */
.cpg-modal-actions {
    display:        flex;
    gap:            12px;
    justify-content:flex-end;
    margin-top:     28px;
}
button.cpg-btn {
    border-radius:  var(--cpg-border-radius-s);
    cursor:         pointer;
     font-family: var(--cpg-title-font)!important;
    font-size:      .9375rem;
    line-height:    1;
    padding:        15px 33px;
        text-transform: none;
    transition:     .3s cubic-bezier(.68, -.6, .32, 1.6);
    -webkit-appearance: none;
}
button.cpg-btn:active { transform: scale(.97); }

button.cpg-btn-cancel {
        background: var(--cpg-cream, #f7f2ed);
}
button.cpg-btn-cancel:hover { background: var(--cpg-red-light); color: var(--cdpg-color-text);transform: scale(1.03) }

button.cpg-btn-save {
    background:  var(--cpg-red);
    color:       #fff;
}
button.cpg-btn-save:hover { background: var(--cpg-red);color:#fff; transform: scale(1.03)}

/* ═══════════════════════════════════════
   BADGES DE ENVÍO EN PRODUCTOS
═══════════════════════════════════════ */
.cpg-delivery-wrap {
        align-items: center;
    border-radius: 17px;
    font-size: .83rem;
    gap: 6px;
    line-height: 1.4;
    margin: 10px 0 0;
    padding: 13px 18px 8px;
    background: var(--cpg-cream);
}

/* Envío gratis */
.cpg-delivery-wrap.cpg-free {
    color:      var(--cpg-success-color);
    font-size:     .83rem;
    background: #effaef;
}
.cpg-delivery-wrap.cpg-no-location {
    background: var(--cpg-red-light);
        max-width: max-content;
}
.cpg-delivery-wrap.cpg-pickup-only,
.cpg-delivery-badge.cpg-pickup-only {
    background: var(--cpg-cream);
    color: var(--cpg-color-text);
}
.cpg-badge-icon { font-size: 1rem; flex-shrink: 0; }
.cpg-badge-text { flex: 1; }
.cpg-free-hint { display:block;font-family: var(--cpg-title-font);padding-left: 30px; }
.cpg-badge-text strong { font-family: var(--cpg-title-font); }
.cpg-delivery-wrap .cpg-delivery-date {
    font-family: var(--cpg-title-font);
}

.cpg-delivery-wrap.cpg-delivery-single {
    flex-wrap: wrap;
}

.cpg-store-pickup-message {
    align-items: center;
    color: var(--cpg-color-text);
    display: flex;
    flex: 0 0 100%;
    font-family: var(--cpg-title-font);
    font-size: .83rem;
    gap: 7px;
    margin-top: 3px;
}

.cpg-store-pickup-message .cpg-store-pickup-icon {
    flex: 0 0 21px;
    height: 21px;
    margin: 0;
    width: 21px;
}

button.cpg-delivery-info-btn {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--cpg-red);
    cursor: pointer;
    display: inline-flex;
    flex: 0 0 100%;
    font-family: var(--cpg-title-font);
    font-size: .78rem;
    gap: 5px;
    justify-content: flex-end;
    line-height: 1.3;
    text-align: right;
    text-transform: none;
    width: 100%;
}

.cpg-delivery-info-btn .cpg-delivery-info-icon {
    flex: 0 0 17px;
    height: 17px;
    width: 17px;
}

button.cpg-delivery-info-btn:hover,
button.cpg-delivery-info-btn:focus-visible {
    background: transparent;
    color: var(--cpg-red-dark, var(--cpg-red));
    outline: none;
}

.cpg-delivery-info-modal {
    max-height: calc(100vh - 32px);
    max-width: 620px;
    overflow-x: hidden;
    overflow-y: auto;
}

.cpg-delivery-info-subtitle strong {
    color: var(--cpg-red);
    font-family: var(--cpg-title-font);
}

.cpg-delivery-info-subtitle .cpg-icon.cpg-icon-pin {
    color: var(--cpg-red);
    height: 17px;
    margin: 0 2px;
    vertical-align: -3px;
    width: 17px;
}

.cpg-delivery-info-methods {
    display: grid;
    gap: 14px;
}

.cpg-delivery-info-method {
    border: 1.5px solid #e9dfd6;
    border-radius: 30px;
    padding: 18px;
}

.cpg-delivery-info-method[hidden] {
    display: none;
}

.cpg-delivery-info-method h3,
.cpg-delivery-info-method h4,
.cpg-delivery-info-method p {
    margin-top: 0;
}

.cpg-delivery-info-method-heading {
    align-items: center;
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.cpg-delivery-info-method-heading .cpg-icon {
    flex: 0 0 24px;
    height: 24px;
    margin: 0;
    width: 24px;
        color: var(--cpg-color-text) !important;
}

.cpg-delivery-info-method[data-cpg-delivery-method="shipping"] .cpg-icon-boost {
    color: var(--cpg-success-color);
}

.cpg-delivery-info-method[data-cpg-delivery-method="pickup"] .cpg-store-pickup-icon {
    color: var(--cpg-red);
}

.cpg-delivery-info-method h3 {
    font-size: 1.12rem;
    line-height: 1.25;
    margin-bottom: 0;
}

.cpg-delivery-info-promise {
    color: var(--cpg-success-color);
    font-family: var(--cpg-title-font);
    font-size: .9rem;
    line-height: 1.4;
    margin-bottom: 8px;
}

.cpg-delivery-info-detail,
.cpg-delivery-info-terms p {
    color: var(--cpg-color-text);
    font-size: .84rem;
    line-height: 1.5;
}

.cpg-delivery-info-detail {
    margin-bottom: 0;
}

.cpg-delivery-info-terms {
    border-top: 1px solid var(--cpg-border);
    margin-top: 14px;
    padding-top: 13px;
}

.cpg-delivery-info-terms h4 {
    font-size: .82rem;
    line-height: 1.3;
    margin-bottom: 5px;
        color: var(--cpg-red) !important;
}

.cpg-delivery-info-terms p {
    margin-bottom: 0;
}

/* Sin ubicación seleccionada → CTA inline */
.cpg-no-location .cpg-open-modal-inline {
        font-family: var(--cpg-title-font);
    position: relative;
    background:  none;
    border:      none;
    color:       var(--cpg-red);
    cursor:      pointer;
    font-size:   14px;
    padding:     0;
    -webkit-appearance: none;
        text-transform: none;
}
.cpg-no-location .cpg-open-modal-inline:hover {
    color: var(--cpg-red-dark);
}

/* ── Shortcode badge (usado en contenido libre) ── */
.cpg-delivery-badge {
    align-items:   center;
    border-radius: 6px;
    display:       inline-flex;
    font-size:     .8125rem;
    gap:           5px;
    padding:       5px 10px;
    vertical-align: middle;
}
.cpg-delivery-badge.cpg-free {
    background: var(--cpg-free-bg);
    color:      var(--cpg-succes-color);
}
.cpg-delivery-badge.cpg-paid {
    background: var(--cpg-paid-bg);
    color:      var(--cpg-paid-color);
}
.cpg-delivery-badge.cpg-delivery-unknown {
    background: #fff3e0;
    color:      #e65100;
    cursor:     pointer;
}
.cpg-delivery-badge strong { font-family: var(--cdpg-title-font); }
.cpg-icon {
    width: 22px;
    height: auto;
    vertical-align: middle;
    margin-right: 5px;
}
.cpg-icon.cpg-icon-pin {
    width: 20px;
    margin-right: 0;
        vertical-align: bottom;
}
.snize-product .cpg-snize-badge,.cpg-snize-badge,.cpg-mht-badge {
        display: inline-block;
    width: max-content;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    color: var(--cpg-success-color) !important;
    margin-bottom: 5px;
    font-family: var(--cpg-title-font);
    background: #ebf7f0;
        border-radius: 5px;
    padding: 0 3px;
}
.snize-product .cpg-snize-badge .cpg-icon,.cpg-snize-badge .cpg-icon,.cpg-mht-badge .cpg-icon {
        width: 18px;
    vertical-align: middle;
    margin-right: 0;
}
.mht-card .cpg-snize-badge {
    margin-bottom: 0;
}
.snize-ac-results-content .snize-product .cpg-snize-badge {
    font-size: 0.62rem;
}
.snize-ac-results-content .snize-product .cpg-snize-badge .cpg-icon {
        width: 16px;
}
/* ═══════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════ */
@media (max-width: 1280px) {
    button.cpg-comuna-btn {
        font-size: .8rem;
    }
}
@media (min-width: 1024px) {
    .cpg-h-header__search-bar {
        align-items: center;
        display: flex;
        gap: 10px;
    }

    .cpg-h-header__search-bar > .cpg-h-header__comuna-selector {
        flex: 0 0 auto;
        min-width: 0;
        width: auto;
    }

    .cpg-h-header__search-bar > .cpg-smart-search {
        flex: 1 1 auto;
        min-width: 0;
        width: auto;
    }

    .cpg-h-header__comuna-selector .cpg-comuna-wrapper {
        align-items: center;
        display: flex;
        margin: 0;
        width: auto;
    }

    .cpg-h-header__comuna-selector button.cpg-comuna-btn {
        box-shadow: none;
        font-family: var(--cpg-title-font);
        height: 48px;
        max-width: 190px;
        padding: 0 14px;
    }

    .cpg-h-header__comuna-selector .cpg-comuna-label-wrap,
    .cpg-h-header__comuna-selector #cpg-comuna-label {
        min-width: 0;
    }

    .cpg-h-header__comuna-selector #cpg-comuna-label {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (min-width: 1024px) and (max-width: 1279px) {
    .cpg-h-header__search-bar {
        gap: 8px;
    }

    .cpg-h-header__comuna-selector button.cpg-comuna-btn {
        max-width: 145px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .cpg-h-header__comuna-selector .cpg-chevron-icon {
        display: none;
    }

    .cpg-h-header__comuna-selector #cpg-comuna-label {
        max-width: 94px;
    }
}
@media (max-width: 600px) {
    .cpg-btn             { text-align: center; width: 100%; }
    .cpg-comuna-btn      { font-size: .8125rem; padding: 6px 12px 6px 9px; }
    .cpg-select {
    padding: 0 20px;
    line-height: 1;
}
.cpg-delivery-wrap {
    font-size: .9rem;
}
.cpg-delivery-wrap.cpg-free {
    font-size: .86rem;
}
    /* Tooltip en móvil: anclado abajo del wrapper, más ancho */
    .cpg-tooltip {
        left:      0;
        transform: translateX(0) translateY(-6px);
        width:     min(280px, 90vw);
    }
    .cpg-tooltip.cpg-tooltip-visible {
        transform: translateX(0) translateY(0);
    }
    .cpg-tooltip::before { left: 30px; transform: none; }
}
@media (max-width: 550px) {
    .cpg-snize-badge,.cpg-snize-badge, .cpg-mht-badge {
        font-size: 0.74rem;
    }

    .cpg-modal-overlay {
        align-items: flex-end;
        animation: none;
        opacity: 0;
        padding: 0;
        transition: opacity .28s ease;
    }

    .cpg-modal-overlay.is-open {
        opacity: 1;
    }

    .cpg-modal-overlay.is-closing {
        opacity: 0;
        pointer-events: none;
    }

    .cpg-modal-container {
        animation: none;
        border-radius: 40px 40px 0 0;
        bottom: 0;
        max-height: 92dvh;
        max-width: none;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: 52px 24px max(28px, env(safe-area-inset-bottom));
        transform: translate3d(0, 100%, 0);
        transition: transform .36s cubic-bezier(.22, 1, .36, 1);
        will-change: transform;
    }

    .cpg-modal-overlay.is-open .cpg-modal-container {
        transform: translate3d(0, 0, 0);
    }

    .cpg-modal-overlay.is-closing .cpg-modal-container {
        transform: translate3d(0, 100%, 0);
    }
}
@media (max-width: 425px) {
        .cpg-delivery-wrap {
        font-size: .8rem;
    }
    .cpg-modal-overlay {
        padding: 0;
    }
    .cpg-modal-title {
    font-size: 1.2rem;
}
button.cpg-comuna-btn .cpg-comuna-label-wrap span.cpg-comuna-eyebrow {
    font-size: 12px;
}
button.cpg-comuna-btn .cpg-comuna-label-wrap span {
    font-size: 13px;
}
button.cpg-btn {
    font-size: .83rem;
}
.cpg-no-location .cpg-open-modal-inline {
    font-size: .79rem;
}
.cpg-icon.cpg-icon-pin {
    width: 18px;
}
}
/* ═══════════════════════════════════════
   PROGRESO DE ENVÍO GRATIS
═══════════════════════════════════════ */
.cpg-free-shipping-progress[hidden] {
    display: none !important;
}

.cpg-free-shipping-progress {
    --cpg-free-progress-color: var(--cpg-red);
    --cpg-free-progress-soft: #f8e2e2;
    box-sizing: border-box;
    font-family: var(--cpg-title-font);
    position: relative;
    width: 100%;
}

.cpg-free-shipping-location-prompt,
button.cpg-comuna-change-btn {
    display: none;
}

.cpg-free-shipping-location-prompt[hidden],
button.cpg-comuna-change-btn[hidden] {
    display: none !important;
}

.cpg-free-shipping-progress *,
.cpg-free-shipping-progress *::before,
.cpg-free-shipping-progress *::after {
    box-sizing: border-box;
}

.cpg-free-shipping-progress-host {
    flex-wrap: wrap;
}

.cpg-free-shipping-progress--drawer,
.cpg-h-cart-drawer__header > .cpg-free-shipping-progress {
    flex: 0 0 100%;
    order: 2;
    margin-top: 8px;
    padding-right: 2px;
}

.cpg-free-shipping-progress__message {
    font-size: 14px;
    line-height: 1.35;
    margin: 0 0 5px;
}

.cpg-free-shipping-progress__amount {
    color: var(--cpg-red)!important;
}

.cpg-free-shipping-progress.has-change-action .cpg-free-shipping-progress__message {
    padding-right: 96px;
}

button.cpg-comuna-change-btn:not([hidden]) {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--cpg-red);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--cpg-title-font);
    font-size: 11px;
    line-height: 1.2;
    padding: 2px 0;
    position: absolute;
    right: 2px;
    text-transform: none;
    top: 0;
}

button.cpg-comuna-change-btn:hover,
button.cpg-comuna-change-btn:focus-visible {
    background: transparent;
    color: var(--cpg-red);
    outline: none;
}

.cpg-free-shipping-progress__row {
    align-items: center;
    display: flex;
    gap: 10px;
    width: 100%;
}

.cpg-free-shipping-progress__track {
    background: #f2e1db;
    border-radius: 999px;
    display: block;
    flex: 1 1 auto;
    height: 7px;
    min-width: 0;
    overflow: hidden;
    position: relative;
}

.cpg-free-shipping-progress__fill {
    background: var(--cpg-free-progress-color);
    border-radius: inherit;
    display: block;
    height: 100%;
    min-width: 0;
    transition: width .3s ease;
}

.cpg-free-shipping-progress__icon {
    color: var(--cpg-free-progress-color) !important;
}

.cpg-free-shipping-progress__icon svg {
    width: 20px;
    height: auto;
    color: var(--cpg-free-progress-color) !important;
}

.cpg-free-shipping-progress__icon svg[stroke="currentColor"] {
    stroke: var(--cpg-free-progress-color) !important;
}

.cpg-free-shipping-progress__icon svg[fill="currentColor"] {
    fill: var(--cpg-free-progress-color) !important;
}

.cpg-h-cart-drawer__header .cpg-free-shipping-progress__icon {
    display: inline-flex;
    flex: 0 0 26px;
    height: 26px;
    width: 26px;
}

.cpg-free-shipping-progress__icon .cpg-icon {
    height: 100%;
    width: 100%;
}

.cpg-free-shipping-progress.is-complete {
    --cpg-free-progress-color: var(--cpg-success-color);
    --cpg-free-progress-soft: var(--cpg-success-bg);
    color: var(--cpg-success-color);
}

.cpg-cart-free-shipping-module {
    box-sizing: border-box;
    margin: 0 0 18px;
    padding: 0 10px;
    width: 100%;
}

.cpg-cart-free-shipping-module .cpg-free-shipping-location-prompt:not([hidden]) {
    display: flex;
    width: 100%;
}

.cpg-cart-free-shipping-module .cpg-free-shipping-location-prompt button.cpg-comuna-btn--drawer-prompt {
    background: var(--cpg-cream);
    border: 0;
    border-radius: 14px;
    color: var(--cpg-color-text);
    display: inline-flex;
    font-size: 12px;
    justify-content: center;
    min-height: 40px;
    padding: 8px 14px;
    width: 100%;
}

.cpg-cart-free-shipping-module .cpg-free-shipping-location-prompt button.cpg-comuna-btn--drawer-prompt:hover,
.cpg-cart-free-shipping-module .cpg-free-shipping-location-prompt button.cpg-comuna-btn--drawer-prompt:focus-visible {
    background: var(--cpg-cream);
    color: var(--cpg-color-text);
}

.cpg-cart-free-shipping-module .cpg-free-shipping-location-prompt .cpg-chevron-icon {
    display: none;
}

.cpg-free-shipping-location-prompt button.cpg-comuna-btn--drawer-prompt.cpg-has-selection .cpg-comuna-label-wrap {
    align-items: center;
    flex: 0 1 auto;
    flex-direction: row;
    gap: 4px;
    max-width: calc(100% - 25px);
    min-width: 0;
    overflow: hidden;
}

.cpg-free-shipping-location-prompt button.cpg-comuna-btn--drawer-prompt.cpg-has-selection .cpg-comuna-eyebrow:not([hidden]) {
    display: inline;
    flex: 0 0 auto;
    font-size: 12px;
    line-height: 1;
    opacity: .82;
}

.cpg-free-shipping-location-prompt button.cpg-comuna-btn--drawer-prompt.cpg-has-selection [data-cpg-comuna-label] {
    flex: 0 1 auto;
    min-width: 0;
    width: auto;
}

.cpg-free-shipping-progress--cart-totals {
    margin: 0;
}

.cpg-free-shipping-progress--cart-totals .cpg-free-shipping-progress__icon {
    display: inline-flex;
    flex: 0 0 26px;
    height: 26px;
    width: 26px;
}

@media (max-width: 480px) {
    #cpg-delivery-info-title {
        font-size: 1.4rem;
    }
    .cpg-delivery-info-method h3 {
        font-size: 1.03rem;
    }
    .cpg-delivery-info-method-heading .cpg-icon {
        flex: 0 0 22px;
        height: 22px;
        width: 22px;
    }
    .cpg-free-shipping-progress--drawer,
    .cpg-h-cart-drawer__header > .cpg-free-shipping-progress {
        margin-top: 6px;
    }

    .cpg-free-shipping-progress__message {
        font-size: 12px;
        padding-right: 28px;
    }

    .cpg-h-cart-drawer__header .cpg-free-shipping-progress__icon {
        flex-basis: 23px;
        height: 23px;
        width: 23px;
    }
}
@media (min-width: 850px) and (max-width: 1023px) {
    .cpg-h-mobile-header__main-row > button.cpg-comuna-btn--mobile-header {
        max-width: 150px;
    }
    .cpg-h-mobile-header__main-row--has-comuna {
        column-gap: 8px;
        grid-template-columns: 48px minmax(180px, 1fr) minmax(150px, 170px) auto;
    }
}
@media (min-width: 769px) and (max-width: 849px) {
    .cpg-h-mobile-header__main-row--has-comuna {
        column-gap: 8px;
        grid-template-columns: 48px minmax(120px, 1fr) minmax(120px, 140px) auto;
    }
    .cpg-h-mobile-header__main-row > button.cpg-comuna-btn--mobile-header {
        max-width: 140px;
    }
}
@media (min-width: 769px) and (max-width: 1023px) {

    .cpg-h-mobile-header__main-row > button.cpg-comuna-btn--mobile-header {
        align-items: center;
        align-self: center;
        background: var(--cpg-red);
        border-radius: 20px;
        display: inline-flex !important;
        font-size: 12px;
        grid-column: 3;
        height: 44px;
        justify-self: stretch;
                justify-content: center;
        margin: 0;
        min-width: 0;
        overflow: hidden;
        padding: 6px 12px;
        width: 100%;
    }

    .cpg-h-mobile-header__main-row > button.cpg-comuna-btn--mobile-header .cpg-comuna-label-wrap,
    .cpg-h-mobile-header__main-row > button.cpg-comuna-btn--mobile-header [data-cpg-comuna-label] {
        max-width: 100%;
        min-width: 0;
    }

    .cpg-h-mobile-header__main-row > button.cpg-comuna-btn--mobile-header [data-cpg-comuna-label] {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .cpg-h-mobile-header__main-row > button.cpg-comuna-btn--mobile-header .cpg-pin-icon {
        height: 18px;
        width: 18px;
    }

    .cpg-h-mobile-header__main-row > button.cpg-comuna-btn--mobile-header .cpg-chevron-icon {
        height: 12px;
        width: 12px;
    }

    .cpg-h-mobile-header__main-row > button.cpg-comuna-btn--mobile-header + .cpg-h-mobile-header__actions {
        grid-column: 4;
        margin-left: 0;
        min-width: 0;
    }
}

@media (max-width: 768px) {
    .cpg-h-mobile-header__main-row > button.cpg-comuna-btn--mobile-header {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .cpg-free-shipping-location-prompt:not([hidden]) {
        display: flex;
        flex: 0 0 100%;
        justify-content: center;
        margin-top: 7px;
        order: 2;
        width: 100%;
    }

    .cpg-free-shipping-location-prompt button.cpg-comuna-btn--drawer-prompt {
        border: 0;
        color: var(--cpg-color-text);
        display: inline-flex;
        font-size: 12px;
        justify-content: center;
        min-height: 36px;
        padding: 8px 14px;
        width: 100%;
        border-radius: 14px;
        background: var(--cpg-cream);
    }

    .cpg-free-shipping-location-prompt button.cpg-comuna-btn--drawer-prompt:hover,
    .cpg-free-shipping-location-prompt button.cpg-comuna-btn--drawer-prompt:focus-visible {
        background: var(--cpg-cream);
        color: var(--cpg-color-text);
    }

    .cpg-free-shipping-location-prompt .cpg-chevron-icon {
        display: none;
    }

}

@media (prefers-reduced-motion: reduce) {
    .cpg-modal-overlay,
    .cpg-modal-container {
        transition: none;
    }

    .cpg-free-shipping-progress__fill {
        transition: none;
    }
}