/* Product page: delivery line + 3 tabs (uses the theme's --by-* tokens; dark mode follows). */
.by-deliv { display: flex; gap: 10px; align-items: center; margin: 12px 0 4px; font-size: .9rem; color: var(--by-ink-soft, #4B463F); }
.by-deliv svg { flex: none; color: var(--by-teal, #0E7C86); }

.by-tabs { margin: 18px 0 8px; }
.by-tabs__bar { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; padding: 4px; background: var(--by-warm, #F1EDE6); border-radius: 999px; }
.by-tabs__tab { margin: 0; min-height: 44px; padding: 0 8px; border: 0; border-radius: 999px; background: transparent; color: var(--by-ink-soft, #4B463F); font: inherit; font-size: .9rem; font-weight: 700; line-height: 1.1; letter-spacing: 0; text-transform: none; cursor: pointer; }
.by-tabs__tab[aria-selected="true"] { background: var(--by-surface, #fff); color: var(--by-ink, #1A1815); box-shadow: 0 1px 2px rgba(26,24,21,.06), 0 8px 18px -12px rgba(26,24,21,.4); }
.by-tabs__tab:focus-visible { outline: 2px solid var(--by-teal, #0E7C86); outline-offset: 1px; }
.by-tabs__panel { padding: 14px 2px 4px; }
.by-tabs__panel[hidden] { display: none; }

/* rows inside a tab: no fold-out, summary becomes a small heading */
.by-tabs details.by-row--in-tab { border: 0 !important; margin: 0 0 14px; padding: 0; }
.by-tabs details.by-row--in-tab > summary { list-style: none; pointer-events: none; cursor: default; padding: 0 0 4px !important; margin: 0; font-size: .74rem !important; letter-spacing: .12em; text-transform: uppercase; color: var(--by-teal, #0E7C86) !important; font-weight: 700 !important; border: 0 !important; min-height: 0 !important; }
.by-tabs details.by-row--in-tab > summary::-webkit-details-marker { display: none; }
.by-tabs details.by-row--in-tab > summary::after, .by-tabs details.by-row--in-tab > summary::before { display: none !important; content: none !important; }
.by-tabs details.by-row--solo > summary { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.by-tabs details.by-row--in-tab .by-row__body { padding: 0 !important; }
html[data-theme="dark"] .by-tabs details.by-row--in-tab > summary { color: #7FD3DA !important; }
