/* =========================================================
   KAMAYO HOMEPAGE - BUNDLE DEALS SECTION
   Clean stable version
   Upload as: /assets/css/home/bundle-section.css
   Scope: bundle cards + bundle details modal only
========================================================= */

/* ---------- Section ---------- */
.km-bundle-section{
    position:relative;
    overflow:hidden;
    background:linear-gradient(135deg,rgba(236,253,245,.92) 0%,rgba(255,255,255,.98) 54%,rgba(240,253,244,.90) 100%);
    border-color:rgba(22,163,74,.12);
}

.km-bundle-section::before{
    content:"";
    position:absolute;
    right:-90px;
    top:-95px;
    width:240px;
    height:240px;
    border-radius:999px;
    background:radial-gradient(circle,rgba(34,197,94,.15) 0%,rgba(34,197,94,0) 68%);
    pointer-events:none;
}

.km-bundle-section .km-section-head,
.km-bundle-section .km-commerce-rail{
    position:relative;
    z-index:1;
}

.km-bundle-section .km-section-head{
    align-items:flex-start;
}

.km-bundle-section .km-commerce-rail{
    display:grid;
    width:100%;
    max-width:100%;
    min-width:0;
    gap:14px;
    align-items:stretch;
}

/* ---------- Bundle card ---------- */
.km-bundle-section .km-commerce-card{
    position:relative;
    display:flex;
    flex-direction:column;
    min-width:0;
    height:100%;
    min-height:286px;
    overflow:hidden;
    border-radius:20px;
    background:#fff;
    border:1px solid rgba(16,185,129,.18);
    box-shadow:0 10px 24px rgba(15,23,42,.06);
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

@media (hover:hover){
    .km-bundle-section .km-commerce-card:hover{
        transform:translateY(-2px);
        border-color:rgba(22,163,74,.34);
        box-shadow:0 16px 34px rgba(15,23,42,.10);
    }

    .km-bundle-section .km-commerce-card:hover .km-commerce-image-wrap img{
        transform:scale(1.035);
    }
}

.km-bundle-section .km-commerce-image-wrap{
    position:relative;
    width:100%;
    aspect-ratio:16/10;
    overflow:hidden;
    background:linear-gradient(135deg,#f0fdf4 0%,#fff 82%);
    border-bottom:1px solid rgba(16,24,40,.05);
}

.km-bundle-section .km-commerce-image-wrap img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    transition:transform .22s ease;
}

.km-bundle-section .km-commerce-badge{
    position:absolute;
    left:10px;
    top:10px;
    z-index:2;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:24px;
    max-width:calc(100% - 20px);
    padding:5px 10px;
    border-radius:999px;
    background:linear-gradient(135deg,#16a34a,#059669);
    color:#fff;
    font-size:11px;
    line-height:1;
    font-weight:950;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    box-shadow:0 8px 18px rgba(22,163,74,.24);
}

.km-bundle-section .km-bundle-card-unavailable .km-commerce-badge{
    background:linear-gradient(135deg,#dc2626,#991b1b);
}

.km-bundle-section .km-commerce-body{
    display:flex;
    flex:1 1 auto;
    flex-direction:column;
    gap:7px;
    min-width:0;
    padding:12px;
}

.km-bundle-section .km-commerce-title{
    margin:0;
    color:#0f172a;
    font-size:15px;
    line-height:1.25;
    font-weight:950;
    letter-spacing:-.01em;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.km-bundle-section .km-commerce-desc{
    margin:0;
    color:#64748b;
    font-size:12px;
    line-height:1.35;
    font-weight:650;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.km-bundle-section .km-commerce-meta-row,
.km-bundle-section .km-bundle-value-row{
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
}

.km-bundle-section .km-commerce-meta-row:empty,
.km-bundle-section .km-bundle-value-row:empty{
    display:none;
}

.km-bundle-section .km-commerce-meta-row span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:22px;
    max-width:100%;
    padding:4px 8px;
    border-radius:999px;
    background:#ecfdf3;
    color:#047857;
    font-size:11px;
    line-height:1;
    font-weight:900;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.km-bundle-section .km-bundle-value-row{
    margin-top:-1px;
}

.km-bundle-section .km-bundle-value-row span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:22px;
    padding:4px 8px;
    border-radius:999px;
    background:#fff7ed;
    color:#c2410c;
    border:1px solid #fed7aa;
    font-size:11px;
    line-height:1;
    font-weight:950;
    white-space:nowrap;
}

.km-bundle-section .km-bundle-value-row span.is-warning{
    background:#fef2f2;
    color:#991b1b;
    border-color:#fecaca;
}

.km-bundle-section .km-commerce-price-row{
    display:flex;
    align-items:baseline;
    gap:7px;
    min-height:24px;
    margin-top:auto;
}

.km-bundle-section .km-commerce-price{
    color:#0f172a;
    font-size:19px;
    line-height:1;
    font-weight:950;
    letter-spacing:-.035em;
    white-space:nowrap;
}

.km-bundle-section .km-commerce-mrp{
    color:#94a3b8;
    font-size:12px;
    line-height:1;
    font-weight:850;
    text-decoration:line-through;
    white-space:nowrap;
}

.km-bundle-section .km-commerce-btn,
.km-bundle-section .km-bundle-view-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:38px;
    border-radius:14px;
    background:#dcfce7;
    border:1px solid #86efac;
    color:#047857;
    text-decoration:none;
    font-size:12px;
    line-height:1;
    font-weight:950;
    white-space:nowrap;
    cursor:pointer;
    appearance:none;
    -webkit-appearance:none;
    transition:background .18s ease,border-color .18s ease,color .18s ease;
}

.km-bundle-section .km-commerce-btn{
    width:100%;
    margin-top:2px;
}

.km-bundle-section .km-bundle-view-btn{
    width:auto;
    min-width:184px;
    align-self:flex-start;
    padding-left:20px;
    padding-right:20px;
}

.km-bundle-section .km-bundle-view-btn::after{
    content:"›";
    display:inline-flex;
    margin-left:8px;
    font-size:14px;
    font-weight:950;
    transform:translateY(-1px);
}

@media (hover:hover){
    .km-bundle-section .km-commerce-btn:hover,
    .km-bundle-section .km-bundle-view-btn:hover{
        background:#bbf7d0;
        border-color:#4ade80;
        color:#065f46;
    }
}

/* ---------- Count-aware desktop layout ---------- */
@media (min-width:1200px){
    .km-bundle-section.km-bundle-count-1 .km-commerce-rail{grid-template-columns:1fr;}
    .km-bundle-section.km-bundle-count-2 .km-commerce-rail{grid-template-columns:repeat(2,minmax(0,1fr));}
    .km-bundle-section.km-bundle-count-3 .km-commerce-rail{grid-template-columns:repeat(3,minmax(0,1fr));}
    .km-bundle-section.km-bundle-count-4plus .km-commerce-rail{grid-template-columns:repeat(4,minmax(0,1fr));}

    .km-bundle-section.km-bundle-count-1 .km-commerce-card{
        display:grid;
        grid-template-columns:300px minmax(0,1fr);
        min-height:178px;
        max-height:198px;
    }

    .km-bundle-section.km-bundle-count-1 .km-commerce-image-wrap{
        height:100%;
        min-height:178px;
        aspect-ratio:auto;
        border-bottom:0;
        border-right:1px solid rgba(16,24,40,.06);
        background:#f8fafc;
    }

    .km-bundle-section.km-bundle-count-1 .km-commerce-body{
        justify-content:center;
        padding:18px 24px;
        gap:8px;
        max-width:560px;
    }

    .km-bundle-section.km-bundle-count-1 .km-commerce-title{font-size:20px;line-height:1.18;max-width:540px;}
    .km-bundle-section.km-bundle-count-1 .km-commerce-desc{font-size:13px;line-height:1.4;max-width:540px;}
    .km-bundle-section.km-bundle-count-1 .km-commerce-price{font-size:22px;}
    .km-bundle-section.km-bundle-count-1 .km-commerce-btn{width:auto;min-width:150px;align-self:flex-start;padding:0 20px;}
}

@media (min-width:992px) and (max-width:1199.98px){
    .km-bundle-section.km-bundle-count-1 .km-commerce-rail{grid-template-columns:1fr;}
    .km-bundle-section.km-bundle-count-2 .km-commerce-rail{grid-template-columns:repeat(2,minmax(0,1fr));}
    .km-bundle-section.km-bundle-count-3 .km-commerce-rail{grid-template-columns:repeat(3,minmax(0,1fr));}
    .km-bundle-section.km-bundle-count-4plus .km-commerce-rail{grid-template-columns:repeat(4,minmax(0,1fr));}

    .km-bundle-section.km-bundle-count-1 .km-commerce-card{
        display:grid;
        grid-template-columns:280px minmax(0,1fr);
        min-height:176px;
        max-height:196px;
    }

    .km-bundle-section.km-bundle-count-1 .km-commerce-image-wrap{
        height:100%;
        min-height:176px;
        aspect-ratio:auto;
        border-bottom:0;
        border-right:1px solid rgba(16,24,40,.06);
        background:#f8fafc;
    }

    .km-bundle-section.km-bundle-count-1 .km-commerce-body{justify-content:center;padding:17px 20px;gap:8px;max-width:520px;}
    .km-bundle-section.km-bundle-count-1 .km-commerce-title{font-size:19px;line-height:1.2;}
    .km-bundle-section.km-bundle-count-1 .km-commerce-desc{font-size:13px;line-height:1.4;}
    .km-bundle-section.km-bundle-count-1 .km-commerce-price{font-size:21px;}
    .km-bundle-section.km-bundle-count-1 .km-commerce-btn{width:auto;min-width:150px;align-self:flex-start;padding:0 18px;}

    .km-bundle-section.km-bundle-count-2 .km-commerce-card,
    .km-bundle-section.km-bundle-count-3 .km-commerce-card,
    .km-bundle-section.km-bundle-count-4plus .km-commerce-card{min-height:276px;}
    .km-bundle-section.km-bundle-count-4plus .km-commerce-title{font-size:14px;}
    .km-bundle-section.km-bundle-count-4plus .km-commerce-price{font-size:18px;}
    .km-bundle-section.km-bundle-count-4plus .km-commerce-body{padding:11px;}
}

@media (min-width:768px) and (max-width:991.98px){
    .km-bundle-section.km-bundle-count-1 .km-commerce-rail{grid-template-columns:1fr;}
    .km-bundle-section.km-bundle-count-2 .km-commerce-rail,
    .km-bundle-section.km-bundle-count-3 .km-commerce-rail,
    .km-bundle-section.km-bundle-count-4plus .km-commerce-rail{grid-template-columns:repeat(2,minmax(0,1fr));}

    .km-bundle-section.km-bundle-count-1 .km-commerce-card{
        display:grid;
        grid-template-columns:260px minmax(0,1fr);
        min-height:174px;
    }

    .km-bundle-section.km-bundle-count-1 .km-commerce-image-wrap{
        height:100%;
        min-height:174px;
        aspect-ratio:auto;
        border-bottom:0;
        border-right:1px solid rgba(16,24,40,.06);
        background:#f8fafc;
    }

    .km-bundle-section.km-bundle-count-1 .km-commerce-body{justify-content:center;padding:16px 18px;gap:8px;}
    .km-bundle-section.km-bundle-count-1 .km-commerce-title{font-size:18px;line-height:1.2;}
    .km-bundle-section.km-bundle-count-1 .km-commerce-btn{width:auto;min-width:145px;align-self:flex-start;padding:0 16px;}
    .km-bundle-section .km-commerce-card{min-height:270px;}
}

/* ---------- Mobile bundle rail ---------- */
@media (max-width:767.98px){
    .km-bundle-section{padding-left:12px;padding-right:12px;}
    .km-bundle-section .km-section-head{gap:8px;}

    .km-bundle-section .km-commerce-rail{
        display:flex;
        gap:10px;
        max-width:none;
        overflow-x:auto;
        overflow-y:hidden;
        scroll-snap-type:x proximity;
        overscroll-behavior-x:contain;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
        padding:1px 0 6px;
    }

    .km-bundle-section .km-commerce-rail::-webkit-scrollbar{display:none;}

    .km-bundle-section .km-commerce-card{
        flex:0 0 258px;
        min-height:278px;
        border-radius:18px;
        scroll-snap-align:start;
    }

    .km-bundle-section.km-bundle-count-1 .km-commerce-card{flex-basis:100%;min-height:270px;}
    .km-bundle-section .km-commerce-body{padding:11px;gap:6px;}
    .km-bundle-section .km-commerce-title{font-size:14px;line-height:1.22;}
    .km-bundle-section .km-commerce-desc{font-size:11px;line-height:1.35;}
    .km-bundle-section .km-commerce-meta-row span{min-height:21px;padding:4px 7px;font-size:10.5px;}
    .km-bundle-section .km-commerce-price{font-size:18px;}
    .km-bundle-section .km-commerce-btn,
    .km-bundle-section .km-bundle-view-btn{width:100%;min-width:0;min-height:36px;border-radius:13px;}
}

@media (max-width:374.98px){
    .km-bundle-section .km-commerce-card{flex-basis:236px;}
    .km-bundle-section.km-bundle-count-1 .km-commerce-card{flex-basis:100%;}
    .km-bundle-section .km-commerce-title{font-size:13.5px;}
}

/* =========================================================
   Bundle details modal
   Modal is rendered outside card to avoid overflow clipping.
========================================================= */
html.km-bundle-modal-open,
body.km-bundle-modal-open{
    overflow:hidden!important;
}

.km-bundle-modal{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    z-index:999999!important;
    display:none!important;
    align-items:center!important;
    justify-content:center!important;
    padding:16px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
}

.km-bundle-modal[aria-hidden="false"]{
    display:flex!important;
}

.km-bundle-modal[aria-hidden="true"]{
    display:none!important;
    pointer-events:none!important;
}

.km-bundle-modal-backdrop{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    border:0!important;
    margin:0!important;
    padding:0!important;
    background:rgba(15,23,42,.62)!important;
    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);
    cursor:pointer!important;
    touch-action:none;
}

.km-bundle-modal-card{
    position:relative!important;
    z-index:2!important;
    width:min(96vw,760px)!important;
    max-height:calc(100dvh - 32px)!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    padding:18px!important;
    border-radius:22px!important;
    background:#fff!important;
    border:1px solid rgba(148,163,184,.35)!important;
    box-shadow:0 24px 80px rgba(15,23,42,.28)!important;
}

.km-bundle-modal-head{
    flex:0 0 auto!important;
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:14px!important;
    margin-bottom:14px!important;
}

.km-bundle-modal-title-wrap{min-width:0;}

.km-bundle-modal-kicker{
    display:inline-flex!important;
    align-items:center!important;
    width:fit-content!important;
    padding:5px 10px!important;
    margin-bottom:7px!important;
    border-radius:999px!important;
    background:#dcfce7!important;
    color:#047857!important;
    font-size:12px!important;
    line-height:1!important;
    font-weight:900!important;
    letter-spacing:.02em!important;
    text-transform:uppercase!important;
}

.km-bundle-modal-title{
    margin:0!important;
    color:#0f172a!important;
    font-size:22px!important;
    line-height:1.15!important;
    font-weight:900!important;
}

.km-bundle-modal-desc{
    margin:6px 0 0!important;
    color:#64748b!important;
    font-size:13px!important;
    line-height:1.45!important;
}

.km-bundle-modal-close{
    flex:0 0 auto!important;
    width:40px!important;
    height:40px!important;
    border:1px solid rgba(148,163,184,.35)!important;
    border-radius:14px!important;
    background:#f8fafc!important;
    color:#0f172a!important;
    font-size:26px!important;
    font-weight:900!important;
    line-height:1!important;
    cursor:pointer!important;
    box-shadow:0 8px 20px rgba(15,23,42,.08)!important;
}

.km-bundle-summary-strip{
    flex:0 0 auto!important;
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:10px!important;
    margin:0 0 12px!important;
}

.km-bundle-summary-strip>div{
    min-width:0!important;
    padding:10px!important;
    border-radius:14px!important;
    background:#f8fafc!important;
    border:1px solid rgba(148,163,184,.35)!important;
}

.km-bundle-summary-strip strong,
.km-bundle-summary-strip span{
    display:block!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.km-bundle-summary-strip strong{
    color:#0f172a!important;
    font-size:17px!important;
    line-height:1.1!important;
    font-weight:900!important;
}

.km-bundle-summary-strip span{
    margin-top:4px!important;
    color:#64748b!important;
    font-size:11px!important;
    font-weight:800!important;
}

.km-bundle-extra-note,
.km-bundle-stock-alert{
    flex:0 0 auto!important;
    width:fit-content!important;
    max-width:100%!important;
    margin:0 auto 12px!important;
    padding:8px 12px!important;
    border-radius:999px!important;
    font-size:12px!important;
    line-height:1.25!important;
    font-weight:900!important;
}

.km-bundle-extra-note{
    background:#ecfdf5!important;
    color:#047857!important;
    border:1px dashed rgba(16,185,129,.45)!important;
}

.km-bundle-stock-alert{
    background:#fff7ed!important;
    color:#c2410c!important;
    border:1px dashed #fed7aa!important;
}

.km-bundle-modal-subhead{
    flex:0 0 auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    margin:0 0 8px!important;
}

.km-bundle-modal-subhead span{
    color:#0f172a!important;
    font-size:15px!important;
    font-weight:900!important;
}

.km-bundle-modal-subhead em{
    color:#64748b!important;
    font-size:12px!important;
    font-style:normal!important;
    font-weight:800!important;
}

.km-bundle-items-list{
    flex:1 1 auto!important;
    min-height:180px!important;
    max-height:min(46dvh,430px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-right:6px!important;
    padding-bottom:8px!important;
    box-sizing:border-box!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    scrollbar-width:thin;
}

.km-bundle-item-row{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    width:100%!important;
    min-height:78px!important;
    padding:10px 12px!important;
    margin:0 0 10px!important;
    border-radius:16px!important;
    background:#fff!important;
    border:1px solid rgba(148,163,184,.35)!important;
    box-sizing:border-box!important;
}

.km-bundle-item-row.is-low-stock{
    border-color:#fecaca!important;
    background:#fff7f7!important;
}

.km-bundle-item-row>img{
    flex:0 0 54px!important;
    width:54px!important;
    height:54px!important;
    max-width:54px!important;
    max-height:54px!important;
    object-fit:contain!important;
    border-radius:12px!important;
    background:#f8fafc!important;
    border:1px solid rgba(148,163,184,.25)!important;
    padding:3px!important;
    box-sizing:border-box!important;
}

.km-bundle-item-info{
    min-width:0!important;
    flex:1 1 auto!important;
}

.km-bundle-item-name{
    margin:0 0 4px!important;
    color:#0f172a!important;
    font-size:13px!important;
    line-height:1.25!important;
    font-weight:900!important;
}

.km-bundle-item-meta{
    margin:0 0 7px!important;
    color:#64748b!important;
    font-size:12px!important;
    line-height:1.25!important;
    font-weight:800!important;
}

.km-bundle-item-price-line{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:6px!important;
}

.km-bundle-item-price-line span{
    display:inline-flex!important;
    align-items:center!important;
    width:fit-content!important;
    min-height:22px!important;
    padding:4px 8px!important;
    border-radius:999px!important;
    background:#ecfdf5!important;
    color:#047857!important;
    font-size:11px!important;
    line-height:1!important;
    font-weight:900!important;
    white-space:nowrap!important;
}

.km-bundle-stock-warning{
    display:inline-flex!important;
    margin-top:7px!important;
    padding:4px 7px!important;
    border-radius:999px!important;
    background:#fee2e2!important;
    color:#991b1b!important;
    font-size:10px!important;
    line-height:1!important;
    font-weight:950!important;
}

.km-bundle-empty-items{
    margin:0 0 10px!important;
    padding:12px!important;
    border-radius:15px!important;
    background:#f8fafc!important;
    border:1px dashed #cbd5e1!important;
    color:#64748b!important;
    font-size:12px!important;
    line-height:1.35!important;
    font-weight:850!important;
}

.km-bundle-items-list::-webkit-scrollbar{width:6px!important;}
.km-bundle-items-list::-webkit-scrollbar-thumb{background:rgba(15,23,42,.24)!important;border-radius:999px!important;}

.km-bundle-modal-actions{
    flex:0 0 auto!important;
    position:sticky!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    z-index:5!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(180px,240px)!important;
    align-items:center!important;
    gap:12px!important;
    margin:10px -18px -18px!important;
    padding:12px 18px 14px!important;
    border-top:1px solid rgba(187,247,208,.95)!important;
    background:linear-gradient(180deg,rgba(255,255,255,.94) 0%,#f0fdf4 100%)!important;
    box-shadow:0 -14px 30px rgba(15,23,42,.10)!important;
    box-sizing:border-box!important;
}

.km-bundle-modal-action-price{
    min-width:0!important;
    display:flex!important;
    flex-direction:column!important;
    gap:3px!important;
}

.km-bundle-modal-action-price strong,
.km-bundle-modal-action-price span{
    display:block!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.km-bundle-modal-action-price strong{
    color:#0f172a!important;
    font-size:19px!important;
    line-height:1.05!important;
    font-weight:950!important;
    letter-spacing:-.035em!important;
}

.km-bundle-modal-action-price span{
    color:#047857!important;
    font-size:12px!important;
    line-height:1.15!important;
    font-weight:900!important;
}

.km-bundle-modal-actions .km-bundle-add-btn{
    width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 18px!important;
    border:0!important;
    border-radius:16px!important;
    background:linear-gradient(135deg,#16a34a 0%,#059669 100%)!important;
    color:#fff!important;
    text-decoration:none!important;
    font-size:14px!important;
    line-height:1!important;
    font-weight:950!important;
    white-space:nowrap!important;
    cursor:pointer!important;
    appearance:none!important;
    -webkit-appearance:none!important;
    box-shadow:0 12px 24px rgba(22,163,74,.28)!important;
    transition:transform .16s ease,box-shadow .16s ease,filter .16s ease!important;
}

.km-bundle-modal-actions .km-bundle-add-btn:active{
    transform:translateY(1px)!important;
    box-shadow:0 8px 16px rgba(22,163,74,.24)!important;
}

.km-bundle-modal-actions .km-bundle-add-btn:disabled{
    background:linear-gradient(135deg,#cbd5e1 0%,#94a3b8 100%)!important;
    color:#fff!important;
    cursor:not-allowed!important;
    box-shadow:none!important;
    filter:none!important;
}

@media (hover:hover){
    .km-bundle-modal-actions .km-bundle-add-btn:not(:disabled):hover{
        filter:brightness(1.03)!important;
        box-shadow:0 14px 30px rgba(22,163,74,.34)!important;
    }
}
body.km-bundle-modal-open .km-sticky-cart,
body.km-bundle-modal-open #kmStickyCart,
body.km-bundle-modal-open #stickyCart,
body.km-bundle-modal-open .sticky-cart,
body.km-bundle-modal-open .sticky-cart-wrap,
body.km-bundle-modal-open .bottom-cart-bar,
body.km-bundle-modal-open .km-bottom-cart,
body.km-bundle-modal-open .mini-cart,
body.km-bundle-modal-open .km-mini-cart,
body.km-bundle-modal-open #miniCart,
body.km-bundle-modal-open #kmMiniCart,
body.km-bundle-modal-open .floating-cart,
body.km-bundle-modal-open .cart-floating,
body.km-bundle-modal-open .km-cart-floating,
body.km-bundle-modal-open .cart-summary-floating{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
}

@media (max-width:767.98px){
    .km-bundle-modal{
        padding:10px!important;
        align-items:center!important;
    }

    .km-bundle-modal-card{
        width:calc(100vw - 20px)!important;
        max-height:calc(100dvh - 20px)!important;
        border-radius:18px!important;
        padding:14px!important;
    }

    .km-bundle-modal-title{font-size:18px!important;}
    .km-bundle-modal-desc{font-size:12px!important;}

    .km-bundle-summary-strip{
        grid-template-columns:repeat(4,minmax(0,1fr))!important;
        gap:6px!important;
    }

    .km-bundle-summary-strip>div{
        padding:8px 6px!important;
        border-radius:12px!important;
    }

    .km-bundle-summary-strip strong{font-size:13px!important;}
    .km-bundle-summary-strip span{font-size:9px!important;}
    .km-bundle-extra-note,
    .km-bundle-stock-alert{font-size:11px!important;padding:7px 10px!important;}

    .km-bundle-items-list{
        min-height:160px!important;
        max-height:44dvh!important;
        padding-right:4px!important;
    }

    .km-bundle-item-row{
        min-height:72px!important;
        gap:10px!important;
        padding:9px 10px!important;
        border-radius:14px!important;
    }

    .km-bundle-item-row>img{
        flex-basis:48px!important;
        width:48px!important;
        height:48px!important;
        max-width:48px!important;
        max-height:48px!important;
        border-radius:11px!important;
    }

    .km-bundle-item-name{font-size:12px!important;}
    .km-bundle-item-meta{font-size:11px!important;}
    .km-bundle-item-price-line span{font-size:10px!important;padding:4px 7px!important;}

    .km-bundle-modal-actions{
        grid-template-columns:1fr!important;
        gap:8px!important;
        margin:9px -14px -14px!important;
        padding:10px 14px 12px!important;
    }

    .km-bundle-modal-action-price{
        align-items:center!important;
        text-align:center!important;
    }

    .km-bundle-modal-action-price strong{font-size:17px!important;}
    .km-bundle-modal-action-price span{font-size:11px!important;}

    .km-bundle-modal-actions .km-bundle-add-btn{
        min-height:46px!important;
        border-radius:15px!important;
        font-size:13px!important;
    }
}


/* KAMAYO APP MOBILE FORCE v20260502 */
html.km-mobile-device .km-bundle-section{
    padding-left:10px!important;
    padding-right:10px!important;
}

html.km-mobile-device .km-bundle-section .km-commerce-rail{
    display:flex!important;
    gap:10px!important;
    max-width:none!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x proximity!important;
    overscroll-behavior-x:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    padding:1px 0 6px!important;
}

html.km-mobile-device .km-bundle-section .km-commerce-rail::-webkit-scrollbar{
    display:none!important;
}

html.km-mobile-device .km-bundle-section .km-commerce-card{
    flex:0 0 min(88vw,330px)!important;
    min-height:278px!important;
    display:flex!important;
    border-radius:18px!important;
    scroll-snap-align:start!important;
}

html.km-mobile-device .km-bundle-section.km-bundle-count-1 .km-commerce-card{
    flex-basis:100%!important;
    min-height:270px!important;
}

html.km-mobile-device .km-bundle-section .km-commerce-image-wrap{
    aspect-ratio:16/10!important;
    height:auto!important;
    min-height:0!important;
    border-right:0!important;
    border-bottom:1px solid rgba(16,24,40,.05)!important;
}

html.km-mobile-device .km-bundle-section .km-commerce-body{
    padding:11px!important;
    gap:6px!important;
}

html.km-mobile-device .km-bundle-section .km-commerce-title{
    font-size:14px!important;
    line-height:1.22!important;
}

html.km-mobile-device .km-bundle-section .km-commerce-desc{
    font-size:11px!important;
    line-height:1.35!important;
}

html.km-mobile-device .km-bundle-section .km-commerce-price{
    font-size:18px!important;
}

html.km-mobile-device .km-bundle-section .km-commerce-btn,
html.km-mobile-device .km-bundle-section .km-bundle-view-btn{
    width:100%!important;
    min-width:0!important;
    min-height:36px!important;
    border-radius:13px!important;
}

html.km-mobile-device .km-bundle-modal{
    padding:10px!important;
    align-items:center!important;
}

html.km-mobile-device .km-bundle-modal-card{
    width:calc(100vw - 20px)!important;
    max-height:calc(100dvh - 20px)!important;
    border-radius:18px!important;
    padding:14px!important;
}

html.km-mobile-device .km-bundle-summary-strip{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
}

html.km-mobile-device .km-bundle-items-list{
    min-height:160px!important;
    max-height:44dvh!important;
}

html.km-mobile-device .km-bundle-modal-actions{
    grid-template-columns:1fr!important;
    gap:8px!important;
    margin:9px -14px -14px!important;
    padding:10px 14px 12px!important;
}

@media (pointer:coarse){
    .km-bundle-section .km-commerce-rail{display:flex!important;overflow-x:auto!important;}
    .km-bundle-section .km-commerce-card{flex:0 0 min(88vw,330px)!important;}
}
