.amm-bundle-wrap{
 max-width:1400px;
 margin:0 auto;
 padding:20px 20px 90px;
 position:relative;
}

.amm-header{
    margin-bottom:16px;
}

.amm-title{
    font-size:28px;
    line-height:1.2;
    font-weight:800;
    margin:0 0 8px;
    color:#111;
}

.amm-description{
    margin:0;
    color:#666;
    font-size:15px;
    line-height:1.5;
}

.amm-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
}

.amm-card{
    position:relative;
    display:flex;
    flex-direction:column;
    height:100%;
    background:#fff;
    border:1px solid #ececec;
    border-radius:16px;
    overflow:hidden;
    transition:all .25s ease;
    box-shadow:0 1px 2px rgba(0,0,0,.03);
    cursor:pointer;
}

.amm-card:hover{
    box-shadow:0 10px 24px rgba(0,0,0,.08);
    transform:translateY(-2px);
}

.amm-card.is-selected{
    border-color:#c7922f;
    box-shadow:0 0 0 2px rgba(199,146,47,.14), 0 10px 24px rgba(0,0,0,.08);
}

.amm-badge{
    position:absolute;
    top:10px;
    left:10px;
    z-index:2;
    background:#ff4d4f;
    color:#fff;
    font-size:12px;
    font-weight:700;
    padding:4px 10px;
    border-radius:999px;
}

.amm-image{
    width:100%;
    aspect-ratio:1/1;
    overflow:hidden;
    background:#f7f7f7;
    padding:8px;
}

.amm-image img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
}

.amm-content{
    display:flex;
    flex-direction:column;
    flex:1;
    padding:14px;
}

.amm-category{
    font-size:12px;
    font-weight:700;
    color:#777;
    text-transform:uppercase;
    letter-spacing:.3px;
    margin-bottom:6px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.amm-product-title{
    margin:0 0 10px;
    font-size:15px;
    line-height:1.35;
    font-weight:700;
    color:#111;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    min-height:40px;
}

.amm-price{
    margin-bottom:12px;
    font-size:16px;
    font-weight:700;
    color:#111;
}

.amm-price del{
    color:#999;
    font-size:13px;
    font-weight:600;
    margin-left:6px;
}

.amm-select-btn,
.amm-add-cart-btn,
.amm-modal__confirm,
.amm-modal__cancel{
    border:none;
    cursor:pointer;
    font-weight:800;
    letter-spacing:.2px;
    transition:all .25s ease;
    display:flex;
    align-items:center;
    justify-content:center;
    line-height:1;
    min-height:48px;
}

.amm-select-btn{
    width:100%;
    margin-top:auto;
    padding:12px 14px;
    border-radius:10px;
    background:#111;
    color:#fff;
    text-transform:uppercase;
    font-size:13px;
}

.amm-card.is-selected .amm-select-btn{
    background:#c7922f;
}

.amm-select-btn:hover{
    opacity:.9;
}

.amm-bottom-bar{
 position:fixed;
 left:0;
 right:0;
 bottom:0;
 z-index:10001;
 background:rgba(255,255,255,.96);
 backdrop-filter:blur(10px);
 border-top:1px solid #ececec;
 box-shadow:0 -6px 24px rgba(0,0,0,.08);
 padding:14px 18px;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:16px;
 flex-wrap:wrap;
}

.amm-bundle-complete .amm-add-cart-btn{
    animation:ammPulse .8s ease-in-out infinite alternate;
}

@keyframes ammPulse{
    from{ transform:translateY(0); box-shadow:0 0 0 rgba(199,146,47,0); }
    to{ transform:translateY(-1px); box-shadow:0 10px 26px rgba(199,146,47,.18); }
}

.amm-bottom-left{
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
    min-width:0;
    overflow:visible;
}

.amm-selected-count{
    font-weight:700;
    color:#222;
    min-width:92px;
}

.amm-selected-items{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    overflow:visible;
}

.amm-plus{
    font-size:24px;
    color:#333;
    font-weight:700;
    line-height:1;
    opacity:.85;
}

.amm-slot-item{
    position:relative;
    width:58px;
    height:58px;
    border-radius:12px;
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:visible;
}

.amm-slot-item--selected{
    background:transparent;
}

.amm-slot-preview{
    width:58px;
    height:58px;
    border-radius:12px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.38);
    background:rgba(255,255,255,.46);
    backdrop-filter:blur(12px) saturate(160%);
    box-shadow:0 8px 18px rgba(0,0,0,.08);
}

.amm-slot-preview img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    background:#fff;
}

.amm-slot-item--empty{
    border:2px dashed #d6d6d6;
    background:rgba(255,255,255,.75);
}

.amm-slot-plus-in{
    font-size:28px;
    font-weight:300;
    color:#b6b6b6;
    line-height:1;
    transform:translateY(-1px);
}

.amm-remove-item{
    position:absolute;
    top:-8px;
    right:-8px;
    width:18px;
    height:18px;
    border:1px solid rgba(255,255,255,.55);
    background:rgba(17,17,17,.96);
    color:#fff;
    font-size:12px;
    line-height:1;
    cursor:pointer;
    z-index:4;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    box-shadow:0 6px 14px rgba(0,0,0,.14);
    padding:0;
}

.amm-bottom-right{
    display:flex;
    align-items:center;
    gap:14px;
    margin-left:auto;
    flex-wrap:wrap;
}

.amm-total-wrap{
    min-width:180px;
}

.amm-total-line{
    font-size:18px;
    font-weight:700;
    color:#111;
}

.amm-old-total del{
    color:#888;
    font-size:14px;
    margin-left:8px;
    font-weight:600;
}

.amm-save-badge{
    display:inline-block;
    margin-top:4px;
    background:#2ea44f;
    color:#fff;
    border-radius:999px;
    padding:4px 10px;
    font-size:12px;
    font-weight:800;
}

.amm-add-cart-btn{
    min-width:190px;
    padding:14px 22px;
    border-radius:12px;
    background:linear-gradient(90deg,#d9b15f,#c58a2f);
    color:#fff;
    text-transform:uppercase;
    font-size:15px;
}

.amm-add-cart-btn:disabled{
    opacity:.45;
    cursor:not-allowed;
    animation:none;
}

/* Variation modal */
.amm-variation-modal{
    display:none;
    position:fixed;
    inset:0;
    z-index:100000;
}

.amm-variation-modal.is-open{
    display:block;
}

.amm-modal__overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.58);
    backdrop-filter:blur(2px);
}

.amm-modal__dialog{
    position:relative;
    width:min(560px, calc(100% - 24px));
    max-height:90vh;
    overflow:auto;
    margin:5vh auto;
    background:#fff;
    border-radius:20px;
    padding:22px;
    box-shadow:0 20px 60px rgba(0,0,0,.25);
}

.amm-modal__close{
    position:absolute;
    top:12px;
    right:12px;
    width:24px;
    height:24px;
    border:none;
    background:rgba(255,255,255,.18);
    color:#111;
    border-radius:6px;
    cursor:pointer;
    font-size:16px;
    line-height:1;
    display:flex;
    align-items:center;
    justify-content:center;
    backdrop-filter:blur(12px) saturate(160%);
    box-shadow:0 8px 18px rgba(0,0,0,.08);
    padding:0;
}

.amm-modal__head{
    display:flex;
    gap:14px;
    align-items:flex-start;
    margin-bottom:14px;
}

.amm-modal__thumb{
    width:92px;
    height:92px;
    object-fit:contain;
    border-radius:14px;
    background:#f6f6f6;
    flex:0 0 auto;
    padding:6px;
}

.amm-modal__head-content{
    min-width:0;
    flex:1;
}

.amm-modal__category{
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    color:#777;
    margin-bottom:4px;
}

.amm-modal__title{
    margin:0 0 8px;
    font-size:20px;
    line-height:1.3;
    font-weight:800;
    color:#111;
}

.amm-modal__price{
    font-size:18px;
    font-weight:800;
    color:#111;
}

.amm-modal__price del{
    color:#999;
    font-size:14px;
    margin-left:8px;
    font-weight:600;
}

.amm-modal__sale{
    color:#111;
}

.amm-modal__info{
    color:#666;
    font-size:14px;
    margin-bottom:14px;
}

.amm-attr-group{
    margin-bottom:16px;
}

.amm-attr-label{
    font-size:14px;
    font-weight:800;
    color:#111;
    margin-bottom:8px;
}

.amm-pill-list{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.amm-pill{
    position:relative;
    border:1px solid rgba(255,255,255,.45);
    background:rgba(255,255,255,.55);
    color:#111;
    border-radius:999px;
    padding:12px 16px;
    font-size:13px;
    font-weight:800;
    cursor:pointer;
    backdrop-filter:blur(14px) saturate(160%);
    box-shadow:0 8px 18px rgba(0,0,0,.06);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:46px;
}

.amm-pill:hover{
    border-color:#c7922f;
}

.amm-pill.is-active{
    background:rgba(248,239,223,.95);
    border-color:#c7922f;
    box-shadow:0 10px 20px rgba(199,146,47,.16);
}

.amm-pill--short{
    width:52px;
    min-width:52px;
    height:52px;
    padding:0;
    border-radius:50%;
}

.amm-pill.is-unavailable{
    opacity:.45;
    cursor:not-allowed;
    border-color:rgba(217,48,37,.35);
}

.amm-pill.is-unavailable::after{
    content:'✕';
    position:absolute;
    top:3px;
    right:6px;
    font-size:11px;
    color:#d93025;
    font-weight:900;
}

.amm-modal__summary{
    font-size:13px;
    color:#666;
    margin-top:8px;
    min-height:18px;
}

.amm-modal__footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-top:18px;
    flex-wrap:wrap;
}

.amm-modal__stock{
    font-size:13px;
    font-weight:700;
    color:#2ea44f;
}

.amm-modal__stock.is-out{
    color:#d93025;
}

.amm-modal__stock.is-out::before{
    content:'✕ ';
    font-weight:900;
}

.amm-modal__cancel{
    background:transparent;
    color:#666;
    min-height:auto;
    padding:0;
    font-size:14px;
    font-weight:700;
}

.amm-modal__confirm{
    min-width:180px;
    padding:14px 18px;
    border-radius:12px;
    background:linear-gradient(90deg,#d9b15f,#c58a2f);
    color:#fff;
    text-transform:uppercase;
    font-size:14px;
}

.amm-modal__confirm:disabled{
    opacity:.45;
    cursor:not-allowed;
}

/* Celebration overlay */
.amm-celebration-overlay{
    position:fixed;
    inset:0;
    z-index:1000000;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(8,10,20,.78);
    backdrop-filter:blur(6px);
    opacity:0;
    animation:ammOverlayIn .25s forwards;
}

.amm-celebration-overlay.amm-hide{
    animation:ammOverlayOut .45s forwards;
}

@keyframes ammOverlayIn{
    to{ opacity:1; }
}

@keyframes ammOverlayOut{
    to{ opacity:0; }
}

.amm-celebration-card{
    position:relative;
    z-index:2;
    width:min(92vw, 420px);
    background:#fff;
    border-radius:24px;
    padding:28px 22px;
    text-align:center;
    box-shadow:0 24px 80px rgba(0,0,0,.32);
    transform:scale(.9);
    animation:ammCardPop .35s ease forwards;
}

@keyframes ammCardPop{
    to{
        transform:scale(1);
    }
}

.amm-celebration-icon{
    font-size:52px;
    line-height:1;
    margin-bottom:10px;
}

.amm-celebration-title{
    font-size:28px;
    font-weight:900;
    color:#111;
    margin-bottom:8px;
}

.amm-celebration-sub{
    font-size:15px;
    color:#555;
    line-height:1.5;
}

.amm-celebration-confetti{
    position:absolute;
    inset:0;
    overflow:hidden;
    pointer-events:none;
}

.amm-celebration-piece{
    position:absolute;
    top:-12px;
    width:10px;
    height:18px;
    border-radius:3px;
    opacity:1;
    animation:ammCelebrateFall 2.8s ease-out forwards;
    animation-delay:var(--delay);
}

@keyframes ammCelebrateFall{
    0%{
        transform:translateY(0) translateX(0) rotate(0deg);
        opacity:1;
    }
    100%{
        transform:translateY(110vh) translateX(var(--dx)) rotate(var(--rot));
        opacity:0;
    }
}

@media (max-width: 991px){
    .amm-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:14px;
    }
}

@media (max-width: 767px){
    .amm-bundle-wrap{
         padding:14px 12px 90px;
    }

    .amm-title{
        font-size:22px;
    }

    .amm-description{
        font-size:14px;
    }

    .amm-bottom-bar{
  bottom:0;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  z-index:10002;
    }

    .amm-bottom-left{
        width:100%;
        gap:8px;
        align-items:center;
        flex-wrap:nowrap;
        overflow:visible;
    }

    .amm-selected-count{
        font-size:14px;
        min-width:auto;
        flex:0 0 auto;
    }

    .amm-selected-items{
        flex-wrap:nowrap;
        overflow:visible;
        min-width:0;
    }

    .amm-bottom-right{
        width:100%;
        margin-left:0;
        flex-direction:row;
        align-items:center;
        gap:10px;
        flex-wrap:nowrap;
    }

    .amm-total-wrap{
        min-width:0;
        flex:1;
    }

    .amm-total-line{
        font-size:16px;
    }

    .amm-add-cart-btn{
        min-width:145px;
        padding:12px 14px;
        font-size:13px;
    }

    .amm-modal__dialog{
        width:calc(100vw - 12px);
        margin:6px auto;
        padding:14px 14px 12px;
        border-radius:18px;
        max-height:calc(100vh - 110px);
    }

    .amm-modal__thumb{
        width:78px;
        height:78px;
    }

    .amm-modal__title{
        font-size:18px;
    }

    .amm-modal__price{
        font-size:16px;
    }

    .amm-modal__confirm{
        min-width:0;
        width:100%;
    }

    .amm-modal__cancel{
        width:100%;
        text-align:center;
        padding:6px 0 0;
    }

    .amm-modal__footer{
        gap:8px;
    }
}

/* Mobile: 2 cards per row, reduced gap, hide category label */
@media (max-width: 575px){
    .amm-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
    }

    .amm-card{
        border-radius:16px;
        overflow:hidden;
    }

    .amm-image{
        aspect-ratio:1 / 1;
        padding:6px;
    }

    .amm-content{
        padding:9px;
    }

    .amm-category{
        display:none !important;
    }

    .amm-product-title{
        font-size:13px;
        line-height:1.35;
        min-height:34px;
        -webkit-line-clamp:2;
        margin-bottom:8px;
    }

    .amm-price{
        font-size:14px;
        margin-bottom:10px;
    }

    .amm-price del{
        font-size:12px;
    }

    .amm-select-btn{
        padding:10px 10px;
        font-size:12px;
        border-radius:10px;
        min-height:42px;
    }

    .amm-slot-item{
        width:52px;
        height:52px;
        border-radius:12px;
        overflow:visible;
    }

    .amm-slot-preview{
        width:52px;
        height:52px;
        border-radius:12px;
    }

    .amm-slot-item--empty{
        border-width:2px;
    }

    .amm-slot-plus-in{
        font-size:24px;
    }

    .amm-remove-item{
        width:18px;
        height:18px;
        top:-8px;
        right:-8px;
        font-size:12px;
        border-radius:50%;
        z-index:5;
    }

    .amm-card{
        background:#fff;
        border:1px solid #eee;
        box-shadow:0 2px 8px rgba(0,0,0,.04);
    }

    .amm-badge{
        top:8px;
        left:8px;
        font-size:11px;
        padding:3px 8px;
    }

    .amm-select-btn{
        background:linear-gradient(90deg,#d9b15f,#c7922f);
        color:#111;
    }

    .amm-celebration-card{
        width:min(92vw, 360px);
        padding:24px 18px;
        border-radius:22px;
    }

    .amm-celebration-title{
        font-size:22px;
    }

    .amm-celebration-sub{
        font-size:14px;
    }

    .amm-celebration-icon{
        font-size:44px;
    }

    .amm-modal__head{
        flex-direction:column;
    }

    .amm-modal__thumb{
        width:100%;
        height:120px;
        object-fit:contain;
        padding:8px;
    }

    .amm-modal__confirm{
        width:100%;
        min-height:46px;
    }

    .amm-pill{
        min-height:40px;
        padding:10px 12px;
    }

    .amm-pill--short{
        width:46px;
        min-width:46px;
        height:46px;
    }
}