:root{--brand-blue: #03218b;--brand-yellow: #f8cf40;--brand-yellow-light: #FAF1D2;--brand-light-blue: #e0ecff;--text-dark: #333;--text-light: #555;--slot-size: 90px;--slot-border-radius: 50%;--shadow-light: 0 2px 5px rgba(0,0,0,.1);--shadow-strong: 0 3px 8px rgba(0,0,0,.2);--section-padding: 40px 20px}.split-bg{background-color:var(--brand-yellow-light);padding:var(--section-padding);display:flex;flex-direction:column;min-height:420px}.build-a-box-wrapper{flex:1;display:grid;grid-template-columns:3fr 2fr;gap:40px;align-items:start}.box-info{text-align:center}.box-title{font-size:clamp(24px,2.2vw,32px);font-weight:700;margin-bottom:8px;color:var(--brand-blue);text-wrap:balance}.box-subtitle{font-size:clamp(16px,1.6vw,18px);font-weight:700;margin-bottom:12px;color:var(--brand-blue);display:flex;justify-content:center;gap:12px;align-items:center}.box-description{font-size:16px;margin-bottom:20px;color:var(--text-light);padding:0 7rem}.box-description p{margin:0 0 10px;line-height:1.6}button:focus-visible,[role=button]:focus-visible,input:focus-visible{outline:3px solid var(--brand-yellow);outline-offset:2px;border-radius:8px}.box-size-options{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.box-size-options label{cursor:pointer}.box-size-options input{display:none}.box-size-options span{background:#fff;color:var(--brand-blue);font-weight:600;padding:8px 18px;border-radius:999px;box-shadow:var(--shadow-light);transition:all .2s;border:2px solid #ccc}.box-size-options span:hover{background:var(--brand-yellow);color:#fff}.box-size-options input:checked+span{background:linear-gradient(90deg,#03218b,#3450c3);color:#fff;box-shadow:var(--shadow-strong);border:2px solid #ccc}.box-content{display:flex;flex-direction:column;height:100%}.slots-title{font-size:22px;font-weight:700;color:var(--brand-blue);margin-bottom:16px;text-align:center}.slot-grid{flex:1;display:grid;gap:10px;justify-content:center;justify-items:center;margin-bottom:40px;grid-template-columns:repeat(6,minmax(0,1fr))}.slot{border:2px dashed #ccc;border-radius:var(--slot-border-radius);background:#fafafa;width:var(--slot-size);height:var(--slot-size);display:flex;justify-content:center;align-items:center;position:relative;transition:transform .2s}.slot.disabled{opacity:.3;pointer-events:none;filter:grayscale(80%)}.slot.filled{border:2px solid var(--brand-yellow);background:#fff;cursor:pointer}.slot img{width:100%;height:100%;border-radius:var(--slot-border-radius);object-fit:cover}.slot span{display:none}.slot.filled:hover img{transform:scale(.9)}.slot.filled button{position:absolute;top:0;right:-5px;background:var(--brand-yellow);color:#fff;border:none;border-radius:50%;width:30px;height:30px;font-size:20px;font-weight:700;cursor:pointer;display:none;align-items:center;justify-content:center;line-height:1;box-shadow:var(--shadow-light)}.slot:hover button{display:flex}@keyframes fadeInSlot{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.slot.fade-in{animation:fadeInSlot .4s ease}.flavours-section{margin-top:20px}.flavour-wrapper{text-align:center;margin:40px auto;background:#fff;padding:40px 30px}.flavour-main-heading{font-size:clamp(22px,2.2vw,26px);font-weight:700;color:var(--brand-blue);margin-bottom:10px;text-transform:uppercase;text-wrap:balance}.flavour-sort{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:20px auto 30px;padding:12px 20px;background:var(--brand-light-blue);border-radius:999px}.sort-pill{padding:6px 16px;border:none;border-radius:20px;font-size:1.1rem;font-weight:600;color:#03218b;background:#fff;cursor:pointer;transition:background .25s,color .25s}.sort-pill.active,.sort-pill:hover{background:linear-gradient(90deg,#f8cf40,#f1a903);color:#fff}.flavour-list{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;position:relative}.flavour-card{background:#fff;border:1px solid #eee;border-radius:12px;width:200px;max-width:42vw;padding:12px;text-align:center;box-shadow:var(--shadow-light);transition:transform .2s,box-shadow .2s,opacity .4s;display:flex;flex-direction:column;align-items:center;will-change:transform,opacity}.flavour-card:hover{box-shadow:var(--shadow-strong)}.flavour-card.hidden{display:none!important}.flavour-card.entering{opacity:0;transform:translateY(30px)}.flavour-card.leaving{opacity:0}.flavour-img-wrapper{width:130px;height:130px;position:relative;margin:0 auto 8px;cursor:pointer}.flavour-img{width:100%;height:100%;object-fit:cover;border-radius:8px;transition:opacity .4s;position:absolute;top:0;right:0;bottom:0;left:0}.flavour-img.primary{opacity:1;z-index:1}.flavour-img.hover-img{opacity:0;z-index:2}.flavour-card.has-hover:hover .hover-img{opacity:1}.flavour-card.has-hover:hover .primary{opacity:0}.flavour-name{display:block;margin-top:4px;font-size:15px;font-weight:400;color:var(--brand-blue);line-height:1.3}.flavour-actions{display:flex;flex-direction:column;gap:6px;margin-top:8px;width:100%}.flavour-add-btn,.flavour-info-btn{padding:8px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s;border:none}.flavour-add-btn{background:linear-gradient(90deg,#f8cf40,#f1a903);color:#fff}.flavour-add-btn:hover{background:linear-gradient(90deg,#f1a903,#f8cf40)}.flavour-info-btn{background:#f9f9f9;color:var(--brand-blue);border:2px solid var(--brand-blue)}.flavour-info-btn:hover{background:linear-gradient(90deg,#03218b,#3450c3);color:#fff;border-color:#3450c3}.flavour-action-container{background:var(--brand-yellow-light);border-radius:16px;padding:30px 20px;margin-top:40px;text-align:center}.flavour-action-text{font-size:16px;color:var(--brand-blue);margin-bottom:20px;line-height:1.6;max-width:700px;margin-inline:auto;font-style:italic}.flavour-action-buttons{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.flavour-vault-btn,.flavour-random-btn{background:#fff;color:var(--brand-blue);font-weight:700;font-size:16px;border:none;border-radius:999px;padding:12px 32px;cursor:pointer;transition:background .2s,color .2s;text-transform:uppercase;text-decoration:none}.flavour-vault-btn:hover,.flavour-random-btn:hover{background:linear-gradient(90deg,#3450c3,#03218b);color:#fff}.add-to-cart-wrapper{margin-top:auto;display:flex;justify-content:flex-end;align-items:center;gap:20px;flex-wrap:wrap;align-self:flex-end}.qty-label{font-size:14px;font-weight:600;color:var(--brand-blue);letter-spacing:1px}.quantity-selector{display:flex;align-items:center;border:1.5px solid var(--brand-blue);border-radius:30px;overflow:hidden;background:#fff;box-shadow:var(--shadow-light)}.qty-btn{background:transparent;border:none;padding:8px 14px;cursor:pointer;font-size:18px;font-weight:700;color:var(--brand-blue);transition:background .2s;font-family:inherit}.qty-btn:hover{background:linear-gradient(90deg,#f8cf40,#f1a903)}.qty-input{width:50px;text-align:center;border:none;font-size:16px;font-weight:600;color:var(--brand-blue);outline:none;padding:8px 0;font-family:inherit;-moz-appearance:textfield}.qty-input::-webkit-outer-spin-button,.qty-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.add-to-cart-price{font-size:20px;font-weight:700;color:var(--brand-blue)}.add-to-cart-btn{background:linear-gradient(90deg,#f8cf40,#f1a903);color:#fff;font-size:16px;font-weight:700;padding:12px 36px;border:none;border-radius:999px;cursor:pointer;transition:background .5s,transform .1s;box-shadow:var(--shadow-light)}.add-to-cart-btn[disabled]{opacity:.5;cursor:not-allowed}.add-to-cart-btn:not([disabled]):hover{background:linear-gradient(90deg,#f1a903,#f8cf40);transform:translateY(-1px)}.build-a-box-sticky{position:fixed;top:calc(102px + env(safe-area-inset-top));left:0;right:0;width:100%;min-height:150px;background:var(--brand-yellow-light);box-shadow:var(--shadow-strong);z-index:20;transform:translateY(-100%);opacity:0;pointer-events:none;transition:transform .4s,opacity .3s}.build-a-box-sticky.show{transform:translateY(0);opacity:1;pointer-events:auto}.sticky-inner{width:100%;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;height:100%}.sticky-row{display:grid;width:100%;padding:0 40px;min-width:0}.sticky-row-1{grid-template-columns:1fr 3fr;align-items:end;padding:15px 40px;box-shadow:0 2px 4px #00000014}.sticky-row-2{grid-template-columns:250px 1fr;align-items:center;gap:20px;padding:15px 40px}.sticky-row .box-subtitle,.sticky-row .box-size{margin-bottom:0;justify-content:flex-start!important;text-align:left}.sticky-left{text-align:left;min-width:0}.sticky-right{text-align:right;min-width:0}.slot-grid-wrapper{position:relative;width:100%}.slot-grid--sticky{display:flex!important;flex-wrap:nowrap;align-items:center;gap:12px;justify-content:flex-start;width:100%;max-width:100%;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:0 0 14px;margin:0;scrollbar-width:auto;scrollbar-color:var(--brand-yellow) var(--brand-light-blue)}.slot-grid--sticky::-webkit-scrollbar{height:18px}.slot-grid--sticky::-webkit-scrollbar-track{background-color:var(--brand-light-blue)!important;border-radius:999px}.slot-grid--sticky::-webkit-scrollbar-thumb{background-color:var(--brand-yellow)!important;border-radius:999px;border:3px solid var(--brand-light-blue)}.slot-grid--sticky .slot{width:70px;height:70px;border-radius:50%;flex:0 0 auto}.flavour-modal{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:100;justify-content:center;align-items:flex-start;padding:40px 20px;overflow-y:auto;opacity:0;transition:opacity .3s;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.flavour-modal.show{display:flex;opacity:1}.flavour-modal-content{background:#fff;padding:20px;border-radius:12px;max-width:700px;width:100%;margin:auto;box-shadow:0 6px 20px #00000040;text-align:center;position:relative;font-size:1.6rem;line-height:1.6;transform:translateY(120px);opacity:0;transition:transform .8s,opacity .8s}.flavour-modal.show .flavour-modal-content{transform:translateY(0);opacity:1}.flavour-modal.closing{opacity:0}.flavour-modal.closing .flavour-modal-content{transform:translateY(120px);opacity:0}.flavour-modal-close{position:absolute;top:12px;right:20px;background:transparent;border:none;font-size:28px;font-weight:700;cursor:pointer;color:#03218b}.flavour-modal-title,.flavour-modal-body h2{margin:0;font-size:28px;font-weight:700;color:#03218b}.flavour-modal-subtitle{margin:0;color:#f8cf40;font-weight:700}.flavour-modal-body>img{max-width:180px;height:auto;margin-bottom:0}.flavour-modal-images.two-images{display:flex;gap:12px;justify-content:center;margin-bottom:0}.flavour-modal-images.two-images img{max-width:180px;height:auto}.flavour-modal-centertext{text-align:center;margin-top:1rem}.flavour-modal-divider{border:0;border-top:1px solid #ccc;margin:12px 0 14px}.accordion{margin:12px 0;text-align:left}.accordion:first-of-type{border-top:1px solid #ccc;padding-top:1rem}.accordion-header{width:100%;display:flex;justify-content:space-between;align-items:center;background:#03218b0d;padding:8px 10px;border-radius:6px;cursor:pointer;margin-bottom:6px;border:none;text-transform:uppercase;font-weight:700;font-size:1.6rem;color:#03218b}.accordion-header:after{content:"\25bc";font-size:1.5rem;line-height:1;transition:transform .3s;color:#03218b}.accordion-header.open:after{transform:rotate(180deg)}.accordion-body{max-height:0;overflow:hidden;transition:max-height .3s;text-align:left;font-size:1.6rem;margin-top:6px;padding:4px 2px;color:#333}.accordion-body p{margin:6px 0}.accordion-body img,.bonbon-accordion-image{max-width:100%;height:auto;display:block;margin:6px auto 0}.flavour-modal-storage{margin-top:16px;font-size:1.6rem;text-align:center}.toast-popup{position:fixed;bottom:20px;left:0;background:linear-gradient(90deg,#03218b,#3450c3);color:#fff;border-radius:12px;box-shadow:var(--shadow-strong);padding:16px 20px;max-width:360px;z-index:9999;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}.toast-popup.show{opacity:1;pointer-events:auto;transform:translateY(0) translate(8%)}.toast-popup h4{margin:0 0 6px;font-size:16px;font-weight:700;color:#fff}.toast-popup p{margin:0;font-size:14px;color:#fff;line-height:1.4}.toast-close{position:absolute;color:#fff;top:8px;right:12px;background:transparent;border:none;font-size:18px;font-weight:700}@media (max-width: 1200px){:root{--slot-size: 84px}.build-a-box-wrapper{gap:28px}.box-description{padding:0 4rem}.flavour-img-wrapper{width:120px;height:120px}}@media (max-width: 990px){.build-a-box-wrapper{grid-template-columns:1fr}.box-description{padding:0 2rem}.slot-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.add-to-cart-wrapper{justify-content:center;align-self:center}.build-a-box-sticky{top:calc(98px + env(safe-area-inset-top))}.sticky-row{padding:0 20px}.sticky-row-1{grid-template-columns:1fr;row-gap:10px;text-align:left}.sticky-row-2{grid-template-columns:1fr}.sticky-right{text-align:left}}@media (max-width: 900px){.flavour-card{width:180px}.flavour-img-wrapper{width:110px;height:110px}}@media (max-width: 768px){:root{--slot-size: 78px}.slot-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.slot-grid--sticky .slot{width:60px;height:60px}.flavour-card{width:46vw;max-width:220px}.flavour-sort{gap:8px;padding:10px 12px}.box-subtitle,.sticky-left .box-size{display:none}}@media (max-width: 600px){:root{--slot-size: 72px}.split-bg,.flavour-wrapper{padding:28px 16px}.add-to-cart-price{font-size:18px}.add-to-cart-btn{padding:10px 24px;width:100%}.sticky-row-2{gap:0}.qty-input{padding:4px 0}.qty-btn{padding:4px 10px}}@media (max-width: 480px){.box-description{padding:0 1rem;font-size:15px}.sort-pill{font-size:.95rem;padding:6px 12px}.flavour-card{width:40vw;max-width:420px}.flavour-img-wrapper{width:35vw;height:35vw;max-width:180px;max-height:180px}.sticky-row-1{padding:12px 16px}.sticky-row-2{padding:8px 16px 14px}}@media (max-width: 360px){:root{--slot-size: 64px}.flavour-img-wrapper{width:42vw;height:42vw}.sort-pill{font-size:.9rem}}@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}.gift-modal{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:110;justify-content:center;align-items:center;padding:16px}.gift-modal.show{display:flex}.gift-modal-content{background:#fff;padding:20px;border-radius:12px;max-width:560px;width:100%;box-shadow:0 10px 30px #0003;transform:translateY(10px);opacity:0;transition:transform .2s ease,opacity .2s ease;position:relative}.gift-modal.show .gift-modal-content{transform:translateY(0);opacity:1}.gift-modal-content h3{text-transform:uppercase;font-weight:700}.gift-modal-close{background:var(--brand-yellow);color:var(--brand-blue);border-radius:6px;border:0;font-size:24px;position:absolute;right:20px;top:16px;cursor:pointer}.gift-qty-note{margin-top:6px;color:red;text-align:center;background:var(--brand-yellow-light)}.gift-message{width:100%;border:1px solid #ddd;border-radius:8px;padding:10px;margin-top:10px;resize:vertical}.gift-message[disabled]{background:#f7f7f7;color:#999;cursor:not-allowed}.gift-charcount{margin-top:6px;font-size:.85rem;opacity:.8;text-align:right}.gift-checkbox input[type=checkbox]{accent-color:#f8cf40}.gift-actions{display:flex;justify-content:flex-end;margin-top:16px}.gift-actions .gift-confirm-btn:not(.add-to-cart-btn){color:#fff;border:0;cursor:pointer;padding:8px 16px;border-radius:9999px}@media (prefers-reduced-motion: reduce){.gift-modal-content{transition:none;transform:none;opacity:1}}
/*# sourceMappingURL=/cdn/shop/t/11/assets/build-a-box.css.map */