/* Gift Box Bundles - product page */
/* [gift_box] on the page: hide the duplicate box in the theme's add-to-cart form before
 * the first paint (gift-box.js does the same for browsers without :has). */
body:has(form.ggb-form) form.cart:not(.ggb-form):has(.ggb-box) { display: none; }
.ggb-form, .ggb-box { display: block; width: 100%; flex: 1 0 100%; box-sizing: border-box; }
.ggb-box { margin: 0 0 1.5em; --ggb-photo: 96px; --ggb-gap: 30px; }
/* Same space from photo to photo, within a slot and between slots. */
.ggb-slot { margin: 0 0 var(--ggb-gap); padding: 0; border: 0; min-width: 0; }
.ggb-options { display: grid; gap: var(--ggb-gap); }
.ggb-choice, .ggb-option { display: flex; align-items: center; gap: 1em; margin: 0; }
/* Title above the dropdown / product name, to the right of the photo. */
.ggb-field { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: .4em; }
.ggb-slot-title { display: block; font-weight: 600; line-height: 1.3; }
.ggb-hint { font-weight: 400; opacity: .7; font-size: .9em; }
.ggb-thumb { flex: none; width: var(--ggb-photo); height: var(--ggb-photo); border: 0; border-radius: 6px; overflow: hidden; line-height: 0; }
/* The theme may give images a border, shadow or margin: keep the photo clean. */
.ggb-box .ggb-thumb img { width: var(--ggb-photo); height: var(--ggb-photo); max-width: none; object-fit: cover; border: 0; box-shadow: none; margin: 0; padding: 0; border-radius: 6px; display: block; }
.ggb-choice select { width: 100%; max-width: 100%; min-width: 0; }
.ggb-choice select:not(.uk-select) { min-height: 44px; padding: .4em .6em; font: inherit; border: 1px solid rgba(0, 0, 0, .2); border-radius: 4px; background-color: #fff; }
/* Included / optional single products */
.ggb-line { display: flex; align-items: center; gap: .6em; }
.ggb-name { flex: 1 1 auto; }
.ggb-price { margin-left: .4em; }
.ggb-price { white-space: nowrap; font-size: .95em; }
.ggb-out { font-size: .85em; color: #a00; }
label.ggb-option { cursor: pointer; }
.ggb-option.is-out { opacity: .5; cursor: not-allowed; }
.ggb-option input[type="checkbox"] { margin: 0; flex: none; }
.ggb-summary { border-top: 1px solid rgba(0, 0, 0, .1); padding-top: .75em; }
.ggb-summary p { margin: 0 0 .3em; }
.ggb-total-line { font-size: 1.15em; }
/* Tooltip above the add-to-cart button when the box is incomplete */
.ggb-tip { position: absolute; z-index: 30; width: max-content; max-width: min(380px, 90vw); padding: 14px 18px; background: #2f3a2c; color: #fff; border-radius: 8px; box-shadow: 0 8px 28px rgba(0, 0, 0, .25); font-size: 1rem; line-height: 1.45; animation: ggb-tip-in .18s ease-out; }
.ggb-tip::after { content: ""; position: absolute; left: 28px; bottom: -8px; border: 8px solid transparent; border-bottom: 0; border-top-color: #2f3a2c; }
.ggb-tip-title { display: block; margin-bottom: .35em; font-size: 1.05em; color: #fff; }
.ggb-tip-body p { margin: 0 0 .2em; color: #fff; }
@keyframes ggb-tip-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
/* Dropdowns still to fill */
.ggb-missing select { border-color: #c0392b !important; box-shadow: 0 0 0 2px rgba(192, 57, 43, .18); }
.ggb-form .quantity { display: inline-block; margin-right: .5em; }
/* Hover: the photo grows over the page without moving anything (mouse only, not touch). */
@media (hover: hover) {
  .ggb-thumb { overflow: visible; position: relative; }
  .ggb-box .ggb-thumb img { position: relative; transform-origin: left center; transition: transform .2s ease, box-shadow .2s ease; }
  .ggb-box .ggb-thumb:hover img { transform: scale(2.5); z-index: 20; box-shadow: 0 6px 24px rgba(0, 0, 0, .25); }
}
@media (max-width: 480px) {
  .ggb-box { --ggb-photo: 72px; --ggb-gap: 22px; }
}
/* Cart: the box's products under the box */
.woocommerce-cart-form .ggb-child td.product-name { padding-left: 2em; }
.woocommerce-cart-form .ggb-child td.product-name::before { content: "↳ "; opacity: .6; }
.ggb-child-qty { display: inline-block; min-width: 2em; text-align: center; }