/*
 * Trophy Site widgets: structure only.
 * Colours, fonts, sizes, borders and radii come from each widget's Elementor
 * style controls (which default to the site kit), so nothing visual is set here.
 */

.ts-arrow { flex: none; }

/* Image helper: a linked image fills its column. Elementor's `.elementor-widget-image a`
   (inline-block) ties on specificity and loads later, so the class is doubled. */
.ts-img-fill.ts-img-fill a { display: block; }

/* Breadcrumbs */
.ts-crumbs { display: flex; flex-wrap: wrap; align-items: center; }
.ts-crumbs a { text-decoration: none; transition: color .2s; }

/* Product grid */
.ts-grid { display: grid; }
.ts-grid-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.ts-grid-sort.ts-grid-sort select { height: 40px; padding: 0 12px; border-style: solid; cursor: pointer; }
.ts-grid-tools { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-left: auto; }
.ts-toggle { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid; }
.ts-toggle__option { display: inline-flex; align-items: center; text-decoration: none; line-height: 1.2; transition: background-color .2s, color .2s; }
.ts-chips { display: flex; flex-wrap: wrap; }
.ts-chip.ts-chip { display: inline-flex; align-items: center; cursor: pointer; border: 1px solid; line-height: 1.2; transition: background-color .2s, color .2s, border-color .2s; }
.ts-pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.ts-pager .page-numbers { display: inline-flex; align-items: center; justify-content: center; aspect-ratio: 1; box-sizing: border-box; border: 1px solid; text-decoration: none; transition: background-color .2s, color .2s, border-color .2s; }
.ts-pager .page-numbers.dots { border-color: transparent; }
.ts-card { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.ts-card[hidden] { display: none; }
.ts-card__media { position: relative; display: block; width: 100%; overflow: hidden; }
.ts-card__media.ts-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s cubic-bezier(.22,1,.36,1); }
.ts-card:hover .ts-card__media img { transform: scale(1.03); }
.ts-card__label { position: absolute; left: 12px; bottom: 12px; display: inline-flex; gap: 6px; align-items: center; padding: 5px 9px; border-radius: 4px; max-width: calc(100% - 24px); }
.ts-card__cat { margin-bottom: 4px; }
.ts-card__title { margin: 0 0 6px; }
.ts-card__title a { display: block; text-decoration: none; transition: color .2s; }
.ts-card__note { margin-top: 2px; }
/* Buttons at the foot of the box: a row of boxes is as tall as its tallest, so they line up per row. */
.ts-card__actions { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; margin-top: auto; padding-top: 14px; }
.ts-card__btn, .ts-card__cart.ts-card__cart { display: inline-flex; flex: 1 1 auto; justify-content: center; align-items: center; gap: 8px; min-width: 0; border-style: solid; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }

/* Product gallery: thumbnails beside the main photo. Full width, or a stacked layout sizes it too short. */
.elementor-widget-ts-product-gallery { width: 100%; }
.ts-gal { display: grid; grid-template-columns: var(--ts-thumb-w, 88px) minmax(0, 1fr); align-items: start; }
.ts-gal--single.ts-gal--single { grid-template-columns: minmax(0, 1fr); }
.ts-gal__thumbs { display: grid; grid-template-columns: var(--ts-thumbs-cols, minmax(0, 1fr)); align-content: start; order: var(--ts-thumbs-order, 0); }
.ts-gal__thumb.ts-gal__thumb { display: block; padding: 0; border: 2px solid transparent; background: none; overflow: hidden; cursor: pointer; aspect-ratio: 1; }
.ts-gal__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ts-gal__main { position: relative; overflow: hidden; aspect-ratio: 1 / 1.05; }
.ts-gal__shot { position: absolute; inset: 0; }
.ts-gal__shot[hidden] { display: none; }
.ts-gal__shot img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Mobile menu: burger + full-screen drawer sliding in from the right. */
.ts-mnav__drawer { position: fixed; inset: 0; z-index: 80; overflow: auto; overscroll-behavior: contain; box-sizing: border-box; transform: translateX(100%); visibility: hidden; transition: transform .4s cubic-bezier(.22,1,.36,1), visibility 0s .4s; }
.ts-mnav.is-open .ts-mnav__drawer { transform: none; visibility: visible; transition: transform .4s cubic-bezier(.22,1,.36,1); }
.ts-mnav__head { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.ts-mnav__logo, .ts-mnav__logo img { display: block; width: auto; max-width: none; }
.ts-mnav__nav { display: flex; flex-direction: column; }
.ts-mnav__link, .ts-mnav__sublink { display: block; border-bottom: 1px solid; text-decoration: none; transition: color .2s; }
.ts-mnav__group > summary { cursor: pointer; list-style: none; }
.ts-mnav__group > summary::-webkit-details-marker { display: none; }
.ts-mnav__group > summary::after { content: "+"; float: right; }
.ts-mnav__group[open] > summary::after { content: "–"; }
.ts-mnav__kid { display: block; text-decoration: none; transition: color .2s; }

/* Image hover zoom (classes on Image widgets). The photo grows when its card / tile is hovered.
   ts-img-zoom: the photo, as on the technology cards. ts-img-zoom--tile: also the frame, as on range tiles,
   where the image fills the tile behind its text. */
.ts-img-zoom { overflow: hidden; }
.ts-img-zoom img { transition: transform 1.2s cubic-bezier(.22,1,.36,1); }
.e-con:hover > .ts-img-zoom img { transform: scale(1.035); }
.e-con > .ts-img-zoom--tile.ts-img-zoom--tile { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; margin: 0; transition: transform .7s cubic-bezier(.22,1,.36,1); }
.ts-img-zoom--tile .elementor-widget-container, .ts-img-zoom--tile a { display: block; height: 100%; }
.ts-img-zoom--tile.ts-img-zoom--tile img { width: 100%; height: 100%; object-fit: cover; }
.e-con:hover > .ts-img-zoom--tile { transform: scale(1.04); }

/* Category shortcuts (home). ts-img-lift: the photo (1 : 1.08 unless the widget sets a height) rises 4px
   when its card is hovered. ts-img-reveal: an icon in a row inside the card fades in and slides into place. */
.ts-img-lift img { aspect-ratio: 1 / 1.08; object-fit: cover; }
.e-con > .ts-img-lift.ts-img-lift { transition: transform .45s cubic-bezier(.22,1,.36,1); }
.e-con:hover > .ts-img-lift.ts-img-lift, .e-con:focus-visible > .ts-img-lift.ts-img-lift { transform: translateY(-4px); }
.e-con:focus-visible > .ts-img-zoom img { transform: scale(1.035); }
.ts-img-reveal.ts-img-reveal { opacity: 0; transform: translateX(-4px); transition: opacity .25s cubic-bezier(.22,1,.36,1), transform .25s cubic-bezier(.22,1,.36,1); }
.e-con:hover > .e-con > .ts-img-reveal.ts-img-reveal, .e-con:focus-visible > .e-con > .ts-img-reveal.ts-img-reveal { opacity: 1; transform: none; }

/* Category list */
.ts-cats { display: flex; flex-direction: column; }
.ts-cats__item { display: flex; justify-content: space-between; align-items: center; gap: 12px; text-decoration: none; transition: background-color .2s, color .2s; }
.ts-cats__sub { display: flex; flex-direction: column; margin: 2px 0 6px 14px; }

/* Add to enquiry */
.ts-ate { display: flex; flex-direction: column; gap: 20px; }
.ts-ate__group { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ts-ate__group legend { padding: 0; margin-bottom: 10px; }
.ts-ate__options { display: flex; flex-wrap: wrap; gap: 8px; }
.ts-opt input { position: absolute; opacity: 0; pointer-events: none; }
.ts-opt span { display: inline-flex; align-items: center; height: 40px; padding: 0 14px; border: 1.5px solid; cursor: pointer; transition: all .2s; }
.ts-opt input:focus-visible + span { outline: 2px solid currentColor; outline-offset: 2px; }
.ts-ate__text.ts-ate__text { width: 100%; min-height: 96px; padding: 12px 14px; border: 1.5px solid; resize: vertical; box-sizing: border-box; }
.ts-ate__text:focus { outline: none; }
.ts-ate__meta { display: flex; justify-content: space-between; gap: 12px; }
/* Add-on fields (Addons): under a composite's chosen option, after its steps, or in a simple product's form. */
.ts-addons { display: flex; flex-direction: column; gap: 16px; }
/* An option with fields: its photo beside its description, the fields full width below. Composite Products
   floats the photo (20%) and the details (80%); the details' wrappers step aside so the fields can span. */
.ts-cp .composited_product_details_wrapper:has(.ts-addons) { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; }
.ts-cp .composited_product_details_wrapper:has(.ts-addons) > .details,
.ts-cp .composited_product_details_wrapper:has(.ts-addons) .component_wrap { display: contents; }
.ts-cp .composited_product_details_wrapper:has(.ts-addons)::after,
.ts-cp .composited_product_details_wrapper:has(.ts-addons) .component_wrap::after { display: none; }
.ts-cp .composite_component .composited_product_details_wrapper:has(.ts-addons) > .composited_product_images.composited_product_images { grid-column: 1; width: 120px; margin: 0 1.5em 0 0; }
.ts-cp .composited_product_details_wrapper:has(.ts-addons) .component_wrap > * { grid-column: 2; }
.ts-cp .composited_product_details_wrapper:has(.ts-addons) .component_wrap > .ts-addons { grid-column: 1 / -1; margin-top: 14px; }
.ts-cp .composite_form > .ts-addons { padding: 18px 0; }
.ts-addon { display: flex; flex-direction: column; gap: 8px; min-width: 0; border: 0; padding: 0; margin: 0; }
.ts-addon legend { padding: 0; margin-bottom: 8px; }
.ts-addon .ts-ate__text.ts-ate__text:not(textarea) { min-height: 0; resize: none; }
.ts-addon .ts-ate__text.ts-ate__text[type=file] { padding: 10px 14px; }
.ts-addon__heading { margin: 0; }
.ts-addon__desc > :first-child { margin-top: 0; }
.ts-addon__desc > :last-child { margin-bottom: 0; }
.ts-addon__choice { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.ts-addon__choice input { margin: 0; }
.ts-ate__preview { display: grid; place-items: center; margin-top: 4px; text-align: center; white-space: pre-wrap; overflow-wrap: anywhere; }
.ts-ate__preview[hidden] { display: none; }
.ts-ate__row { display: flex; gap: 10px; flex-wrap: wrap; }
.ts-ate__btn.ts-ate__btn, .ts-ate__cart.ts-ate__cart { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border-style: solid; white-space: nowrap; cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.ts-ate__note { flex-basis: 100%; margin: 10px 0 0; text-align: center; }
.ts-qty { display: inline-flex; align-items: center; height: 50px; border: 1.5px solid; overflow: hidden; }
.ts-qty.ts-qty button { width: 40px; height: 100%; border: 0; background: none; color: inherit; font-size: 18px; cursor: pointer; }
.ts-qty.ts-qty input { width: 44px; height: 100%; border: 0; border-radius: 0; padding: 0; background: none; text-align: center; -moz-appearance: textfield; }
.ts-qty input::-webkit-inner-spin-button, .ts-qty input::-webkit-outer-spin-button { -webkit-appearance: none; }
/* Composite products: Composite Products' form inside the Add to Enquiry widget, as numbered steps in a panel. */
.ts-cp { --ts-cp-indent: 34px; display: block; }
.ts-ate--composite.ts-ate--composite select { width: 100%; height: 50px; padding: 0 40px 0 14px; border: 1.5px solid; box-sizing: border-box; -webkit-appearance: none; appearance: none; }
.ts-ate--composite.ts-ate--composite .quantity input.qty { width: 64px; height: 50px; border: 1.5px solid; text-align: center; box-sizing: border-box; }
.ts-cp__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 28px; margin-bottom: 4px; }
.ts-cp__count[hidden] { display: none; }
.ts-cp .composite_component { margin: 0; border-bottom: 1px solid; }
.ts-cp .component_title.component_title { display: flex; align-items: center; gap: 10px; min-height: 28px; margin: 0; padding: 0; }
.ts-cp .component_title .aria_title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ts-cp__name { flex: none; }
.ts-cp__step { flex: none; display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; line-height: 1; transition: background-color .2s, color .2s; }
.ts-cp__step > * { grid-area: 1 / 1; }
/* Royal's `svg:not(:root) { display: inline }` outranks a single class. */
.ts-cp__step .ts-cp__tick, .is-chosen .ts-cp__step .ts-cp__num { display: none; }
.is-chosen .ts-cp__step .ts-cp__tick { display: block; }
.ts-cp__chosen { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.ts-cp__chosen[hidden], .ts-cp__optional[hidden] { display: none; }
.ts-cp__value { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ts-cp__optional { margin-left: auto; }
.ts-cp__clear.ts-cp__clear { flex: none; display: inline-flex; align-items: center; gap: 5px; margin-left: auto; border: 1px solid; line-height: 1.2; cursor: pointer; transition: color .2s, border-color .2s, background-color .2s; }
.ts-cp__clear.ts-cp__clear[hidden] { display: none; }
.ts-cp__clear svg { flex: none; }
/* Composite Products' own rules: `.composite_form:not(.paged) .component .component_inner`, and `!important` top margins on the price, message and button boxes (so those are spaced with padding). */
.ts-cp .composite_form .component .component_inner.component_inner { padding: 0 0 0 var(--ts-cp-indent); margin: 0; }
/* Under a chosen option: only its photo (if it has one) and any options of its own. The step title already shows
   the choice ("Your selection: …"), its Clear button replaces "Clear selection", and its cost is in the total. */
.ts-cp .composite_component .composited_product_title_wrapper,
.ts-cp .composite_component .composited_product_details_wrapper .price.price,
.ts-cp .composite_component .composited_product_images:has(.woocommerce-product-gallery__image--placeholder) { display: none; }
/* Radio-style steps: each option is a card; the radio's (empty) label covers the card so all of it is clickable. */
.ts-cp .component_option_radio_buttons_fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.ts-cp .component_option_radio_buttons .select_label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ts-cp .component_option_radio_buttons_container.component_option_radio_buttons_container { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(190px, 100%), 1fr)); gap: 10px; margin: 0; padding: 0; }
.ts-cp .component_option_radio_buttons_container::before, .ts-cp .component_option_radio_buttons_container::after { content: none; }
.ts-cp .component_option_radio_button_container { margin: 0; padding: 0; width: auto; float: none; }
.ts-cp .component_option_radio_button.component_option_radio_button { position: relative; display: flex; flex-direction: column; gap: 4px; height: 100%; margin: 0; padding: 14px; border: 1.5px solid; box-sizing: border-box; text-align: left; cursor: pointer; transition: border-color .2s, box-shadow .2s; }
.ts-cp .component_option_radio_button.disabled { opacity: .45; cursor: not-allowed; }
.ts-cp .component_option_radio_button:has(.radio_button:focus-visible) { outline: 2px solid; outline-offset: 2px; }
.ts-cp .radio_button_input.radio_button_input { position: static; margin: 0; padding: 0; float: none; }
.ts-cp .radio_button_input .radio_button { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.ts-cp .component_option_radio_button_select.component_option_radio_button_select { position: absolute; inset: 0; z-index: 1; margin: 0; padding: 0; cursor: inherit; }
.ts-cp .component_option_radio_button_select::before, .ts-cp .component_option_radio_button_select::after { content: none; }
.ts-cp .radio_button_description.radio_button_description { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 8px; width: 100%; margin: 0; padding: 0; float: none; }
.ts-cp .radio_button_description .title.title, .ts-cp .radio_button_description .price.price { margin: 0; padding: 0; }
.ts-cp .radio_button_description .price { white-space: nowrap; }
.ts-cp .component_description_wrapper:not(:empty) { margin-top: 6px; }
.ts-cp .component_description { margin: 0; }
.ts-cp .component_description p { margin: 0; }
.ts-cp .component_selections { margin-top: 12px; }
.ts-cp .component_options, .ts-cp .component_options_inner, .ts-cp .component_content, .ts-cp .component_summary { margin: 0; padding: 0; }
.ts-cp .component_summary .summary_content:empty, .ts-cp .component_summary .summary_content:not(.populated) { display: none; }
.ts-cp .composited_product_details_wrapper { margin-top: 10px; }
.ts-cp .composited_product_images.composited_product_images { margin: 0; }
.ts-cp .component_options_select_wrapper { position: relative; }
.ts-cp .component_options_select_wrapper::after { content: ""; position: absolute; right: 18px; top: 50%; width: 7px; height: 7px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: translateY(-70%) rotate(45deg); pointer-events: none; }
.ts-cp .composite_form > .ts-ate__group { padding: 18px 0; margin: 0; border-bottom: 0; }
/* Composite Products' price box is read by trophy-site.js into the total below it. */
.ts-cp .composite_form .composite_price { display: none !important; }
.ts-cp__totals { margin-top: 0; }
.ts-cp__totals[hidden], .ts-cp__line[hidden] { display: none; }
.ts-cp__line, .ts-cp__sum { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.ts-cp__line { padding: 3px 0; }
.ts-cp__line > :last-child { flex: none; white-space: nowrap; }
.ts-cp__sum { margin-top: 8px; padding-top: 10px; border-top: 1px solid; }
.ts-cp__lines:empty + .ts-cp__sum { margin-top: 0; padding-top: 0; border-top: 0; }
.ts-cp__amount p, .ts-cp__amount del, .ts-cp__amount ins { margin: 0; }
.ts-cp__todo { display: flex; gap: 8px; align-items: center; margin: 14px 0 0; }
.ts-cp__todo[hidden] { display: none; }
.ts-cp__todo svg { flex: none; }
/* "Still to choose" says it first; Composite Products' own message shows for anything else. */
.ts-cp.has-todo .composite_message { display: none !important; }
.ts-cp .composite_form .composite_data .composite_wrap.composite_wrap { padding-top: 0; }
.ts-cp .composite_message { padding-top: 14px; }
.ts-cp .composite_message .woocommerce-info.woocommerce-info { margin: 0; padding: 0; border: 0; background: none; color: inherit; display: flex; gap: 8px; align-items: center; }
/* WooCommerce's notice icon font isn't loaded here: an info circle in the text colour instead. */
.ts-cp .composite_message .woocommerce-info::before { content: ""; position: static; flex: none; width: 15px; height: 15px; margin: 0; color: inherit; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4M12 8h.01'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4M12 8h.01'/%3E%3C/svg%3E") center / contain no-repeat; }
.ts-cp .composite_message .woocommerce-info ul { margin: 0; padding: 0; list-style: none; }
.ts-cp .composite_button { padding-top: 16px; }
.ts-ate--composite .composited_product_images { max-width: 120px; margin: 12px 0 0; }
.ts-ate--composite .composited_product_images img { width: 100%; height: auto; }
.ts-ate--composite .composite_button { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ts-ate--composite .composite_add_to_cart_button.composite_add_to_cart_button { display: inline-flex; flex: 1 1 auto; justify-content: center; align-items: center; gap: 10px; border-style: solid; cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.ts-ate--composite .composite_add_to_cart_button.disabled { opacity: .45; cursor: not-allowed; }
.ts-ate--composite .ts-ate__btn.ts-ate__btn { flex: 0 0 auto; }
.ts-ate__error[hidden] { display: none; }

/* Enquiry list */
.ts-elist__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; }
.ts-elist__title { margin: 0; }
.ts-elist__link { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }
.ts-elist__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.ts-elist__chip { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border: 1px solid; border-radius: 999px; text-decoration: none; }
.ts-elist__items { list-style: none; margin: 0; padding: 0; }
.ts-elist__item { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid; }
.ts-elist__item:first-child { border-top: 1px solid; }
.ts-elist__thumb { flex: none; aspect-ratio: 1; overflow: hidden; border-radius: 6px; }
.ts-elist__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ts-elist__body { flex: 1; min-width: 0; }
.ts-elist__name { text-decoration: none; }
.ts-elist__qty.ts-elist__qty { width: 64px; height: 38px; text-align: center; border: 1px solid; border-radius: 6px; background: none; }
.ts-elist__remove { display: grid; place-items: center; width: 32px; height: 32px; }

/* Header icon buttons */
.ts-icon-btn.ts-icon-btn { --ts-size: 40px; position: relative; display: inline-grid; place-items: center; width: var(--ts-size); height: var(--ts-size); border: 1px solid; border-radius: 999px; cursor: pointer; text-decoration: none; transition: border-color .2s; padding: 0; }
.ts-icon-btn svg { width: 1em; height: 1em; fill: currentColor; }
.ts-icon-btn svg[stroke] { fill: none; }
.ts-badge { position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; display: grid; place-items: center; line-height: 1; box-sizing: border-box; }
.ts-badge[hidden] { display: none; }

/* Search popover */
.ts-search { position: relative; }
.ts-search__pop { position: absolute; right: 0; top: calc(100% + 10px); z-index: 100; padding: 10px; border: 1px solid; border-radius: 8px; box-shadow: 0 20px 50px -20px rgba(36, 21, 42, .3); }
.ts-search__pop[hidden] { display: none; }
.ts-search__input.ts-search__input { width: 100%; height: 44px; padding: 0 12px; border: 1.5px solid; border-radius: 6px; box-sizing: border-box; background: none; }
.ts-search__results { margin-top: 6px; }
.ts-search__result { display: flex; justify-content: space-between; gap: 12px; padding: 10px; border-radius: 6px; text-decoration: none; }
.ts-search__empty { padding: 10px; margin: 0; }

/* Mega menu panel: links beside a stack of feature photos; the highlighted link's photo fades in. */
.ts-mega { --ts-mega-feature: 300px; display: grid; grid-template-columns: minmax(0, 1fr) var(--ts-mega-feature); }
.ts-mega__list { display: grid; align-content: start; }
.ts-mega__item { display: block; text-decoration: none; }
.ts-mega__name, .ts-mega__sub { display: block; }
.ts-mega__feat { display: flex; flex-direction: column; }
.ts-mega__stack { position: relative; flex: 1; display: block; overflow: hidden; text-decoration: none; }
.ts-mega__stack::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, var(--ts-mega-shade, transparent), transparent 55%); pointer-events: none; }
.ts-mega__img.ts-mega__img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; opacity: 0; transform: scale(1.04); transition: opacity .45s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1); }
.ts-mega__img.ts-mega__img.is-on { opacity: 1; transform: none; }
.ts-mega__cap { position: absolute; left: 16px; right: 16px; bottom: 14px; z-index: 2; display: flex; flex-direction: column; gap: 2px; }
.ts-mega__cap-link, .ts-mega__all { display: inline-flex; align-items: center; }
.ts-mega__cap-link { gap: 6px; }
.ts-mega__all { gap: 8px; align-self: flex-start; text-decoration: none; }
.ts-mega .ts-arrow { width: 1em; height: 1em; transition: transform .25s cubic-bezier(.22,1,.36,1); }
.ts-mega__all:hover .ts-arrow { transform: translateX(4px); }
.ts-mega__feat.has-kids .ts-mega__stack { display: none; }
.ts-mega__kids { flex: 1; display: flex; flex-direction: column; gap: 14px; }
.ts-mega__kids[hidden] { display: none; }
.ts-mega__kids-title { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.ts-mega__kids-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; align-content: start; }
.ts-mega__kid { text-decoration: none; }

/* Artwork upload (WPForms field): a dashed drop zone. The file input stays focusable but invisible. */
.ts-artwork-field { position: relative; }
.ts-artwork.ts-artwork { display: block; margin: 0; cursor: pointer; text-align: center; transition: border-color .2s; }
/* Royal's `svg:not(:root) { display: inline }` outranks a single class. */
.ts-artwork .ts-artwork__icon { display: block; }
.ts-artwork__file[hidden], .ts-artwork.has-file .ts-artwork__prompt { display: none; }
.ts-artwork__file { overflow-wrap: anywhere; }
.ts-artwork-field .ts-artwork__input.ts-artwork__input { position: absolute; top: 0; left: 0; width: 1px; height: 1px; padding: 0; border: 0; opacity: 0; overflow: hidden; clip-path: inset(50%); }

/* Sticky header bar (Royal "Sticky Section"): position: sticky only travels within its parent, and the
   header template's wrapper is just the header's height. Taking the wrapper out of the box tree lets the
   bar stick to the page while the utility bar above it scrolls away. */
body:not(.elementor-editor-active) .elementor:has(> .wpr-sticky-section-yes) { display: contents; }

/* Royal mega menu dropdown: let the panel's shadow show, and drop it in from just above. */
.wpr-nav-menu .wpr-sub-mega-menu.wpr-sub-mega-menu { overflow: visible; }
.wpr-sub-mega-menu > .elementor { transform: translateY(-6px); transition: transform .25s cubic-bezier(.22,1,.36,1); }
.wpr-sub-mega-menu.wpr-animate-sub > .elementor { transform: none; }

/* Shared: animated "added" state */
[data-ts-add].is-added, [data-ts-cart-add].is-added, .ts-ate__btn.is-added, .ts-ate__cart.is-added { pointer-events: none; }

/* "Added to your cart" note, bottom centre. */
.ts-toast { position: fixed; left: 50%; bottom: 28px; z-index: 90; display: flex; gap: 14px; align-items: center; max-width: calc(100vw - 32px); box-sizing: border-box; opacity: 0; transform: translate(-50%, 20px); pointer-events: none; box-shadow: 0 20px 40px -16px rgba(0, 0, 0, .4); transition: opacity .35s cubic-bezier(.22,1,.36,1), transform .35s cubic-bezier(.22,1,.36,1); }
.ts-toast.is-shown { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.ts-toast a { text-decoration: none; white-space: nowrap; }

/* Cart, checkout and My Account (Cart / Checkout / Account widgets). */
.ts-shop { --ts-gap: 28px; }
.ts-shop__grid, .ts-cart { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: var(--ts-gap); align-items: start; }
.ts-shop__sum { position: sticky; top: 108px; }
.ts-panel { box-sizing: border-box; min-width: 0; }
.ts-h { margin: 0; }
.ts-btn.ts-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; box-sizing: border-box; border-style: solid; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.ts-btn.ts-btn.is-disabled, .ts-btn.ts-btn:disabled { opacity: .45; pointer-events: none; }
.ts-shop__cta.ts-shop__cta { width: 100%; margin-top: 20px; }
.ts-shop__fine { margin: 12px 0 0; text-align: center; }
.ts-sum-row, .ts-sum-line { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid; }
.ts-sum-row { padding: 10px 0; }
.ts-sum-row--total { align-items: baseline; padding-top: 16px; border-bottom: 0; }
.ts-sum-line { padding: 12px 0; }
.ts-sum-line em { font-style: normal; }
.ts-sum-line small { display: block; margin-top: 2px; }
.ts-sum-line p { margin: 0; }
.ts-gst { display: block; }
.ts-muted p, .ts-row > p { margin: 0; }
.ts-link.ts-link { padding: 0; border: 0; background: none; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.ts-link.ts-link--plain { text-decoration: none; }
.ts-row { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.ts-row > p { flex: 1; }
.ts-row--center { justify-content: center; }
.ts-er { display: block; margin-top: 4px; }

/* Cart lines */
.ts-line { display: grid; grid-template-columns: 56px minmax(0, 1fr) 120px 80px 36px; gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid; }
.ts-line__img { display: block; width: 56px; height: 56px; overflow: hidden; }
.ts-line__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ts-line__name { display: block; text-decoration: none; transition: color .2s; }
.ts-line__detail { display: block; }
.ts-line__move.ts-line__move, .ts-line__move.ts-line__move:hover, .ts-line__move.ts-line__move:focus { display: block; margin-top: 4px; padding: 0; border: 0; background: none; text-align: left; cursor: pointer; }
.ts-line__total { min-width: 72px; text-align: right; }
.ts-line__rm.ts-line__rm { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: none; cursor: pointer; transition: background-color .2s, color .2s; }
.ts-qtyb { display: inline-flex; align-items: center; justify-content: space-between; height: 40px; border: 1.5px solid; box-sizing: border-box; }
.ts-qtyb.ts-qtyb button, .ts-qtyb.ts-qtyb button:hover, .ts-qtyb.ts-qtyb button:focus { display: grid; place-items: center; width: 44px; height: 100%; padding: 0; border: 0; background: none; color: inherit; cursor: pointer; }
.ts-qtyb.ts-qtyb button:disabled { opacity: .35; cursor: default; }
.ts-qtyb span { min-width: 28px; text-align: center; }
.ts-cart.is-busy { opacity: .6; pointer-events: none; transition: opacity .2s; }
.ts-empty { display: grid; justify-items: center; gap: 12px; padding: 40px 20px; text-align: center; }
.ts-empty p { margin: 0; }
/* Royal's `svg:not(:root) { display: inline }` outranks a single class. */
.ts-empty .ts-empty__icon { display: block; }

/* Checkout */
.ts-co__step { margin-bottom: 20px; }
.ts-co__head { display: flex; align-items: center; gap: 12px; }
.ts-num { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; font-style: normal; }
.ts-ok { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; }
.ts-ok[hidden], .ts-co__auth[hidden], [data-ts-co-pane][hidden] { display: none; }
.ts-seg { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 18px; }
.ts-seg.ts-seg button { display: inline-flex; align-items: center; gap: 6px; height: 42px; padding: 0 16px; border: 1.5px solid; cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.ts-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ts-co__step > .ts-form { margin-top: 16px; }
.ts-co__auth .ts-seg + .ts-form, .ts-co__auth > .ts-form:first-child { margin-top: 16px; }
.ts-form--one { grid-template-columns: 1fr; }
.ts-form__full, .ts-form__group { grid-column: 1 / -1; }
.ts-form__group { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ts-form__group[hidden] { display: none; }
.ts-form__field { min-width: 0; }
.ts-label { display: block; margin-bottom: 6px; }
.ts-input.ts-input { width: 100%; height: auto; padding: 12px 14px; border: 1.5px solid; box-sizing: border-box; box-shadow: none; }
.ts-input.ts-input:focus { outline: none; }
.ts-co__rest.is-locked { opacity: .5; pointer-events: none; }
.ts-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ts-cards--col { grid-template-columns: 1fr; margin-top: 16px; }
.ts-rc { --ts-accent: currentColor; display: flex; align-items: flex-start; gap: 12px; margin: 0; padding: 14px; border: 1.5px solid; box-sizing: border-box; cursor: pointer; transition: border-color .2s, box-shadow .2s; }
.ts-rc input { flex: none; margin: 3px 0 0; accent-color: var(--ts-accent); }
.ts-rc .ts-rc__icon { flex: none; display: block; margin-top: 1px; color: var(--ts-accent); }
.ts-rc__title, .ts-rc__sub { display: block; }
.ts-rc__sub { margin-top: 2px; }
/* WooCommerce's own checkout CSS: clearfix pseudo-elements (they'd take a grid cell) and the grey payment box. */
.ts-form::before, .ts-form::after, .ts-co__payment::before, .ts-co__payment::after { content: none; }
/* WooCommerce styles the payment box by id (#payment), so these match it. */
#payment.ts-co__payment.ts-co__payment { background: none; border-radius: 0; }
#payment.ts-co__payment.ts-co__payment .payment_box { margin: 10px 0 0; padding: 14px; }
#payment.ts-co__payment.ts-co__payment .place-order { margin: 0; padding: 0; }
/* No page header above these (the section hides it), so they keep the mockup's space above. */
.ts-co__done { max-width: 680px; margin: 72px auto 0; padding: 48px 24px; }
.ts-co__empty { max-width: 560px; margin: 72px auto 0; }
.ts-tick { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 8px; border-radius: 50%; }
.ts-tick svg { display: block; }
.ts-lead { max-width: 56ch; margin: 2px auto 0; }
.ts-co__paid { margin: 0 0 16px; }
.ts-shop .woocommerce-error, .ts-shop .woocommerce-message, .ts-shop .woocommerce-info { margin: 0 0 20px; padding: 14px 18px; list-style: none; border: 0; border-left: 3px solid; }
.ts-shop .woocommerce-error::before, .ts-shop .woocommerce-message::before, .ts-shop .woocommerce-info::before { content: none; }
.ts-shop .woocommerce-error li { margin: 0; }
.ts-shop .woocommerce-notices-wrapper:empty { display: none; }

/* My Account */
.ts-acct--signin { display: grid; grid-template-columns: 1fr 1fr; gap: var(--ts-gap); align-items: start; }
.ts-acct--single { max-width: 560px; margin: 0 auto; }
.ts-acct--signin.ts-acct--single { grid-template-columns: 1fr; }
.ts-acct .ts-panel > .ts-h:first-child { margin-bottom: 18px; }
.ts-acct__actions { margin-top: 18px; }
.ts-acct__note { margin: 14px 0 18px; }
.ts-acct--dash { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--ts-gap); align-items: start; }
.ts-acct--dash .ts-panel > .ts-h:first-child, .ts-acct--dash .ts-acct__order-head .ts-h { margin-bottom: 0; }
/* WooCommerce's own CSS floats these at 30% / 68%. */
.ts-acct--dash.ts-acct--dash > .ts-acct-nav, .ts-acct--dash.ts-acct--dash > .woocommerce-MyAccount-content { float: none; width: auto; }
.ts-acct-nav { display: grid; gap: 4px; }
.ts-acct-nav a { display: flex; align-items: center; gap: 10px; padding: 12px 14px; text-decoration: none; transition: background-color .2s, color .2s; }
.ts-acct-nav svg { flex: none; }
.ts-ord { display: grid; grid-template-columns: 100px minmax(0, 1fr) auto 90px; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid; text-decoration: none; }
.ts-pill { justify-self: start; padding: 4px 10px; border-radius: 999px; white-space: nowrap; }
.ts-acct__lead { margin: 12px 0 0; }
.ts-acct__business { margin: 24px 0 0; }
.ts-acct__form { margin-top: 20px; }
.ts-acct__addresses { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; margin-top: 20px; }
.ts-acct__address address { margin: 8px 0 10px; font-style: normal; }
.ts-acct__order-head { gap: 12px; }
.ts-acct__items { margin-top: 16px; }
.ts-acct__sub { margin: 24px 0 8px; }
.ts-acct__pager { margin-top: 16px; }

@media (max-width: 1024px) {
	.ts-shop__grid, .ts-cart, .ts-acct--dash, .ts-acct--signin { grid-template-columns: minmax(0, 1fr); }
	.ts-shop__sum { position: static; }
}
@media (max-width: 640px) {
	.ts-cards, .ts-form, .ts-form__group { grid-template-columns: minmax(0, 1fr); }
	.ts-line { grid-template-columns: 48px minmax(0, 1fr) 110px 32px; }
	.ts-line__img { width: 48px; height: 48px; }
	.ts-line__total { display: none; }
	.ts-ord { grid-template-columns: 1fr auto; }
}

/* Business accounts: application form (Business Application widget). */
.ts-apply__form > .ts-form { margin: 0; }
.ts-apply__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ts-apply__chip.ts-apply__chip { display: inline-flex; align-items: center; height: 38px; padding: 0 16px; border: 1px solid; background: transparent; line-height: 1; cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.ts-apply__seg.ts-apply__seg { margin: 0; }
.ts-apply__drop { display: flex; align-items: center; gap: 14px; padding: 28px; border: 1.5px dashed; cursor: pointer; transition: border-color .2s; }
.ts-apply__drop em { font-style: normal; }
/* Royal's `svg:not(:root) { display: inline }` outranks a single class. */
.ts-apply__drop .ts-apply__icon { display: block; flex: none; }
.ts-apply__drop .ts-apply__preview { height: 48px; width: auto; max-width: 140px; object-fit: contain; padding: 4px; border-radius: 4px; background: #fff; }
.ts-apply__preview[hidden], .ts-apply__name[hidden], .ts-apply__prompt[hidden] { display: none; }
.ts-apply__name { overflow-wrap: anywhere; }
.ts-apply .ts-apply__file.ts-apply__file { position: absolute; width: 1px; height: 1px; padding: 0; border: 0; opacity: 0; overflow: hidden; clip-path: inset(50%); }
.ts-apply__drop { position: relative; }
.ts-apply__notes.ts-apply__notes, .ts-portal__notes.ts-portal__notes { min-height: 110px; resize: vertical; }
.ts-portal__notes.ts-portal__notes { min-height: 70px; }
.ts-apply__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ts-apply__form { position: relative; }
.ts-apply__error { margin: 12px 0 0; text-align: center; }
.ts-apply__done { padding: 48px 24px; text-align: center; outline: none; }
.ts-apply__done[hidden], .ts-apply__form[hidden] { display: none; }
.ts-apply__done .ts-tick { margin-bottom: 20px; }
.ts-apply__done .ts-lead { margin: 14px auto 0; }

/* Business portal: sign in (Business Portal Sign In widget). */
.ts-plogin { max-width: 480px; margin: 0 auto; }
.ts-plogin .ts-plogin__icon { display: block; }
.ts-plogin__title.ts-plogin__title { margin: 10px 0 20px; }
.ts-plogin .ts-er { margin: 12px 0 0; }
.ts-plogin__alt.ts-plogin__alt { margin-top: 10px; }
.ts-plogin__note { margin: 12px 0 0; text-align: center; }

/* Business portal band (logo, organisation, sign out). */
.ts-pband { display: flex; align-items: center; gap: 24px; }
.ts-pband__logo { display: flex; align-items: center; padding: 8px 14px; border: 1px solid; }
.ts-pband__logo img { display: block; height: 44px; width: auto; max-width: 220px; object-fit: contain; }
.ts-pband__meta { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.ts-pband__out.ts-pband__out { flex: none; }
.ts-pband__out svg { display: block; }

/* Business portal: catalogue + This order. */
.ts-portal { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 32px; align-items: start; }
.ts-portal__head { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }
.ts-portal__eyebrow { display: inline-flex; align-items: center; gap: 10px; }
.ts-portal__eyebrow::before { content: ""; width: 22px; height: 1.5px; background: currentColor; }
.ts-portal__title { margin: 0; }
.ts-pp-grid { display: grid; gap: 12px; }
.ts-pp { padding: 14px; border: 1px solid; transition: border-color .2s, box-shadow .2s; }
.ts-pp__top { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; gap: 16px; align-items: center; }
.ts-pp__img { position: relative; aspect-ratio: 1; border-radius: 5px; overflow: hidden; }
.ts-pp__img > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ts-pp__logo { position: absolute; left: 6px; bottom: 6px; display: flex; padding: 2px 5px; border-radius: 3px; background: rgba(255, 255, 255, .94); }
/* As the mockup: the logo 18px high. Elementor's `.elementor img { height: auto }` would otherwise win. */
.ts-pp__img .ts-pp__logo img { display: block; height: 18px; width: auto; max-width: 220px; object-fit: contain; }
.ts-pp__name, .ts-pp__spec { display: block; }
.ts-pp__spec { margin: 2px 0 4px; }
.ts-pp__add[hidden] { display: none; }
.ts-btn.ts-btn--sm svg { display: block; flex: none; }
.ts-pp__edit { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; padding-top: 16px; border-top: 1px solid; }
.ts-pp__cc { display: block; margin-top: 4px; }
.ts-pp__typed.ts-pp__typed { margin-top: 8px; }
.ts-pp__typed[hidden] { display: none; }
.ts-pp__edit > .ts-er, .ts-pp__actions { grid-column: 1 / -1; }
.ts-pp__edit > .ts-er { margin: 0; }
.ts-pp__actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.ts-pp__actions .ts-qtyb { height: 42px; }
.ts-past { margin-top: 40px; }
.ts-past__title.ts-past__title { margin-bottom: 8px; }
.ts-past__row { grid-template-columns: 90px minmax(0, 1fr) auto 90px; }
.ts-past__reorder.ts-past__reorder { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; justify-self: end; }
.ts-past__reorder svg { display: block; }
/* No hover change, as the mockup's .linkish (the theme gives buttons a hover background). */
.ts-past__reorder.ts-past__reorder:hover, .ts-past__reorder.ts-past__reorder:focus { background: none; text-decoration: underline; }
.ts-past__empty { margin: 8px 0 0; }
.ts-portal__order { position: sticky; top: 108px; }
.ts-portal__empty { margin: 12px 0; }
.ts-portal__empty[hidden] { display: none; }
.ts-portal__form { margin-top: 18px; }
.ts-portal__sub { margin-top: 12px; }
.ts-sum-line__r { display: flex; align-items: flex-start; gap: 6px; white-space: nowrap; }
.ts-sum-line__r .ts-line__rm.ts-line__rm { width: 26px; height: 26px; margin-top: -3px; }
.ts-portal .ts-er { margin: 10px 0 0; }

/* PDF preview: the A4 sheet over the page. */
.ts-pdf { position: fixed; inset: 0; z-index: 200; display: flex; flex-direction: column; }
.ts-pdf[hidden] { display: none; }
html.ts-pdf-open { overflow: hidden; }
.ts-pdf__bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 24px; }
.ts-pdf__actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ts-pdf__close.ts-pdf__close { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid; border-radius: 50%; background: transparent; color: inherit; cursor: pointer; }
.ts-pdf__close svg { display: block; }
.ts-pdf__actions .ts-btn.is-added { pointer-events: none; }
.ts-pdf__sent { display: flex; gap: 8px; align-items: center; padding: 10px 24px; }
.ts-pdf__sent[hidden] { display: none; }
.ts-pdf__sent svg { display: block; flex: none; }
.ts-pdf__scroll { flex: 1; overflow: auto; padding: 32px 16px; }
/* The sheet's look is inline (the same template makes the PDF); this is only the A4 page around it. */
.ts-sheet { display: flex; flex-direction: column; box-sizing: border-box; width: 794px; min-height: 1123px; margin: 0 auto; padding: 48px 52px; background: #fff; color: #1d1320; font-size: 13px; line-height: 1.5; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .5); }
.ts-sheet__end { flex: 1; display: flex; flex-direction: column; }
.ts-sheet__foot { margin-top: auto; padding-top: 24px; }
/* Hello Elementor gives tables borders, padding and zebra rows; the sheet's cells set their own. */
.ts-sheet table { margin-bottom: 0; font-size: inherit; }
.ts-sheet.ts-sheet td, .ts-sheet.ts-sheet th { border-left: 0; border-right: 0; border-top: 0; line-height: inherit; }
.ts-sheet.ts-sheet td { background: transparent; }

@media (max-width: 1024px) {
	.ts-portal { grid-template-columns: minmax(0, 1fr); }
	.ts-portal__order { position: static; }
}
@media (max-width: 640px) {
	.ts-pp__top { grid-template-columns: 72px minmax(0, 1fr); }
	.ts-pp__top .ts-pp__add { grid-column: 1 / -1; }
	.ts-pp__edit { grid-template-columns: minmax(0, 1fr); }
	.ts-pband { flex-wrap: wrap; }
	.ts-pdf__bar { flex-direction: column; align-items: flex-start; }
	.ts-past__row { grid-template-columns: 1fr auto; }
}