/* ========== Buy box: due today + trust grid (2026-10-17 sales pass) ========== */
.av-bb-today { margin: 14px 0 0; font-size: 15px; color: var(--av-muted, #5B6B7B); }
.av-bb-today b { color: var(--av-navy, #0B1F3A); font-weight: 700; }
.av-bb-trust.av-bb-trust--grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; }
.av-bb-trust--grid li { padding-left: 24px; background-position: left 3px; line-height: 1.35; font-size: 13px; }
.av-bb-trust--grid li b { display: block; font-size: 14px; font-weight: 600; color: var(--av-navy, #0B1F3A); }
@media (max-width: 420px) { .av-bb-trust.av-bb-trust--grid { grid-template-columns: 1fr; } }

/* ========== Product details as pill tabs (shop.js turns section.av-tab into tabs) ========== */
#av-pd .av-pd-tabs { display: inline-flex !important; width: fit-content !important; max-width: 100%; align-self: flex-start; margin: 0 0 clamp(24px, 3vw, 36px); }
#av-pd section.av-tab[hidden] { display: none !important; }
#av-pd.av-pd-tabbed section.av-tab > h2:first-child { margin-top: 0; }
#av-pd .av-pfaq { margin-top: 20px; display: flex; flex-direction: column; gap: 10px; max-width: 820px; }
#av-pd .av-pfaq details { border: 1px solid var(--av-line, #E3EAF1); border-radius: 14px; background: #fff; }
#av-pd .av-pfaq summary { cursor: pointer; list-style: none; padding: 18px 48px 18px 20px; position: relative; font-weight: 600; font-size: 16px; color: var(--av-navy, #0B1F3A); }
#av-pd .av-pfaq summary::-webkit-details-marker { display: none; }
#av-pd .av-pfaq summary::after { content: "+"; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); font-size: 20px; font-weight: 400; color: var(--av-blue, #0A72BB); }
#av-pd .av-pfaq details[open] summary::after { content: "\2212"; }
#av-pd .av-pfaq details p { margin: 0; padding: 0 20px 18px; font-size: 15px; line-height: 1.6; color: var(--av-muted, #5B6B7B); }
@media (max-width: 767px) { #av-pd .av-pd-tabs { display: flex !important; width: 100% !important; } }

/* Promo-code hint above "Due today" (Oct 27) */
.av-bb-promo { margin: 4px 0 10px; font-size: 14px; color: #1E7A46; font-weight: 600; }

/* Connection toggle (4G / Wi-Fi) above the packs (Oct 28, mobile pass Oct 29) */
.av-bb-groups { border: 0; padding: 0; margin: 0 0 20px; min-width: 0; }
.av-bb-groups legend { padding: 0; margin: 0 0 10px; font-size: 14px; font-weight: 600; color: var(--av-navy, #0B1F3A); }
.av-bb-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 12px; background: #EEF3F7; }
.av-bb-group { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-height: 52px; padding: 6px 10px; border-radius: 9px; cursor: pointer; text-align: center; transition: background-color .2s, box-shadow .2s; }
.av-bb-group input { position: absolute; opacity: 0; pointer-events: none; }
.av-bb-group:has(input:focus-visible) { outline: 2px solid var(--av-blue, #0A72BB); outline-offset: 2px; }
.av-bb-group.is-checked { background: #fff; box-shadow: 0 1px 3px rgba(11, 31, 58, .14), 0 0 0 1.5px var(--av-blue, #0A72BB); }
.av-bb-group-name { font-size: 15px; font-weight: 600; color: var(--av-navy, #0B1F3A); }
.av-bb-group-from { font-size: 12px; color: var(--av-muted, #5B6B7B); }
.av-bb-ghint { margin: 10px 0 0; font-size: 13px; line-height: 1.5; color: var(--av-muted, #5B6B7B); }
.av-bb-packs[hidden], .av-bb-trust li[hidden], .av-bb-ghint[hidden] { display: none !important; }
#av-buybox .av-bb-group, #av-buybox .av-bb-pack { margin: 0; } /* theme gives every label a bottom margin */

/* Pack cards: photo, what it covers, price and per-camera price */
.av-bb-pack { align-items: center; text-align: center; }
.av-bb-pack-img img { display: block; width: 56px; height: 56px; object-fit: contain; border-radius: 8px; }
.av-bb-pack-text, .av-bb-pack-right { display: flex; flex-direction: column; }
.av-bb-pack-right { margin-top: 4px; }
.av-bb-pack-right .av-bb-pack-price { margin: 0; }
.av-bb-pack-unit { font-size: 12px; color: var(--av-muted, #5B6B7B); }

/* Phones: packs as compact rows, quantity next to Buy now */
@media (max-width: 767px) {
	#av-buybox .av-bb-packs { grid-template-columns: 1fr; gap: 8px; }
	#av-buybox .av-bb-pack { display: grid; grid-template-columns: auto 1fr auto; align-items: center; column-gap: 12px; padding: 10px 14px 10px 10px; text-align: left; }
	#av-buybox .av-bb-pack:not(:has(.av-bb-pack-img)) { grid-template-columns: 1fr auto; padding-left: 14px; }
	#av-buybox .av-bb-pack-img img { width: 48px; height: 48px; }
	#av-buybox .av-bb-pack-right { margin: 0; align-items: flex-end; }
	#av-buybox .av-bb-actions { display: grid; grid-template-columns: auto 1fr; gap: 10px; }
	#av-buybox .av-bb-qty { flex: none; justify-content: center; }
	#av-buybox .av-bb-qty input { width: 32px; }
	#av-buybox .av-bb-add { grid-column: 1 / -1; }
	#av-buybox .av-bb-trust.av-bb-trust--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; }
	#av-buybox .av-bb-trust--grid li { font-size: 12px; }
	#av-buybox .av-bb-trust--grid li b { font-size: 13px; }
}

/* Switching 4G / Wi-Fi: sliding pill, then the hint, packs and price fade up (Oct 29) */
.av-bb-seg { position: relative; isolation: isolate; }
.av-bb-seg-thumb { position: absolute; z-index: 0; top: 4px; bottom: 4px; left: 4px; width: calc((100% - 8px - (var(--seg-n, 2) - 1) * 4px) / var(--seg-n, 2)); border-radius: 9px; background: #fff; box-shadow: 0 1px 3px rgba(11, 31, 58, .14), 0 0 0 1.5px var(--av-blue, #0A72BB); transform: translateX(calc(var(--seg-i, 0) * (100% + 4px))); pointer-events: none; }
.av-bb-seg.has-thumb .av-bb-seg-thumb { transition: transform .32s cubic-bezier(.3, .7, .2, 1); }
.av-bb-seg-thumb ~ .av-bb-group { z-index: 1; }
.av-bb-seg-thumb ~ .av-bb-group.is-checked { background: transparent; box-shadow: none; }
.av-bb-group-name, .av-bb-group-from { transition: color .25s; }
.av-bb-seg-thumb ~ .av-bb-group:not(.is-checked) .av-bb-group-name { color: #4A5D70; }
.av-bb-seg-thumb ~ .av-bb-group:not(.is-checked):hover .av-bb-group-name { color: var(--av-navy, #0B1F3A); }
/* Hints and pack lists stacked in one cell: the chosen one fades in as the other fades out */
.av-bb-ghints, .av-bb-packstack { display: grid; }
.av-bb-ghints > *, .av-bb-packstack > * { grid-area: 1 / 1; }
.av-bb-ghint, .av-bb-packstack > fieldset { transition: opacity .28s ease, transform .28s cubic-bezier(.3, .7, .2, 1), visibility 0s linear 0s; }
.av-bb-ghint.is-off, .av-bb-packstack > fieldset.is-off { opacity: 0; transform: translateY(4px); visibility: hidden; pointer-events: none; transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s; }
.av-bb-seg-thumb { will-change: transform; }
@keyframes av-bb-price { from { opacity: .25; } to { opacity: 1; } }
.av-bb-now.av-bb-in { animation: av-bb-price .3s ease both; }
@media (prefers-reduced-motion: reduce) {
	.av-bb-seg.has-thumb .av-bb-seg-thumb { transition: none; }
	.av-bb-now.av-bb-in { animation: none; }
	.av-bb-ghint, .av-bb-packstack > fieldset, .av-bb-ghint.is-off, .av-bb-packstack > fieldset.is-off { transition: none; }
}