/* Tablet (between the breakpoints): Taobao PC below its min width switches the floating panel to a fixed
   purchase bar. Hero stays two columns; the detail flows full width underneath. */

.abtd-page { padding: 16px 24px 0; }
.abtd-main { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "g r" "d d"; column-gap: 24px; }
.abtd-left { display: contents; }
.abtd-gallery { grid-area: g; display: flex; flex-direction: column; }
.abtd-right { grid-area: r; min-width: 0; }
.abtd-details { grid-area: d; margin-top: 16px; }
.abtd-stage { order: 1; aspect-ratio: 1; border-radius: 12px; background: rgba(0, 0, 0, .04); }
.abtd-thumbs { order: 2; display: flex; gap: 8px; margin-top: 12px; overflow-x: auto; scrollbar-width: none; }
.abtd-thumb { width: 64px; height: 64px; }
.abtd-thumb img { width: 60px; height: 60px; }
.abtd-thumb-other { width: 60px; height: 60px; }
.abtd-switch { order: 3; }
.abtd-nav { display: none; }
.abtd-title { font-size: 18px; line-height: 26px; }
.abtd-block-price { margin: 8px 0 16px; }
.abtd-block-rows { padding-bottom: 16px; }
.abtd-form { padding-top: 16px; }

.abtd { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
.abtd-foot { position: fixed; box-sizing: border-box; left: var(--abtd-foot-l, 24px); right: auto; width: var(--abtd-foot-w, calc(100% - 48px)); bottom: 0; z-index: 95; display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 12px 24px calc(12px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .96); box-shadow: 0 -8px 24px rgba(31, 31, 51, .08); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.abtd-foot-btns { flex: 0 1 460px; }
.abtd-foot-icons { order: -1; margin-right: auto; }
.abtd-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.abtd-more { margin-top: 0; padding-top: 28px; border-top: 1px solid var(--abtd-split); }
.abtd-more .abtd-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Room under the site footer for the fixed purchase bar (see frontend.css). */
body.abtd-hide-floating .ct-drawer-canvas[data-location="end"] { --floating-bar-height: var(--abtd-bar-h, 56px); --floating-bar-parent-height: var(--abtd-bar-h, 56px); }
