/* =========================================================================
   Teamfootball — кабінет: presentation над нативними формами WooCommerce My Account.
   Wide: сайдбар із профілем + контент; compact: профіль і ряд чіпів навігації.
   Єдина темна поверхня маршруту — «двері» на сторінці входу. Дизайн: design/concept-account.html.
   ====================================================================== */

/* ---------- Оболонка ---------- */
.woocommerce-account .tf-content-main { padding-block: var(--tf-space-6) var(--tf-space-9); }
.woocommerce-account .tf-content-page,
.woocommerce-account .tf-prose { max-inline-size: none; } /* Кабінет — wide-маршрут, а не вузька контент-сторінка. */
.woocommerce-account div.woocommerce { display: grid; gap: var(--tf-space-6); max-inline-size: none; margin-inline: 0; container: tf-account / inline-size; } /* Обгортка WooCommerce на всю ширину маршруту (стилі WooCommerce обмежують її 1000 px). */
.woocommerce-account .woocommerce::before,
.woocommerce-account .woocommerce::after { display: none; } /* tf-native-exception: none — clearfix WooCommerce ламає grid. */
.woocommerce-account .woocommerce-notices-wrapper:empty { display: none; } /* tf-native-exception: none — порожня обгортка повідомлень не займає рядок сітки. */
.woocommerce-account .woocommerce .clear { display: none; } /* tf-native-exception: none — clearfix WooCommerce не потрібен у grid/flex. */
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content { float: none; inline-size: 100%; min-inline-size: 0; }
.woocommerce-account .woocommerce-MyAccount-content { display: grid; gap: var(--tf-space-6); align-content: start; container-type: inline-size; }

/* ---------- Заголовок екрана ---------- */
.tf-account-head { display: grid; gap: var(--tf-space-2); justify-items: start; }
.tf-account-head__back { display: inline-flex; align-items: center; gap: var(--tf-space-2); min-block-size: var(--tf-target); font-size: var(--tf-size-small); font-weight: 600; color: var(--tf-text-muted); text-decoration: none; }
.tf-account-head__back:hover { color: var(--tf-text); }
.tf-account-head h1 { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tf-space-3); margin: 0; font-size: var(--tf-size-heading); }
.tf-account-head__lede { margin: 0; color: var(--tf-text-muted); max-inline-size: 56ch; }
.tf-account-head__meta { margin: 0; font-family: var(--tf-font-mono); font-size: var(--tf-size-caption); letter-spacing: var(--tf-ls-mono); text-transform: uppercase; color: var(--tf-text-muted); }

/* ---------- Кнопки й поля: нативні класи WooCommerce → примітиви теми ---------- */
.woocommerce-account :is(button.button, .button) { display: inline-flex; align-items: center; justify-content: center; gap: var(--tf-space-2); min-block-size: var(--tf-control); padding: var(--tf-space-2) var(--tf-space-5); border: var(--tf-bw-control) solid var(--tf-text); border-radius: var(--tf-radius-pill); background: var(--tf-text); color: var(--tf-on-inverse); font-weight: 700; text-decoration: none; cursor: pointer; transition: background-color var(--tf-motion-fast) var(--tf-easing), border-color var(--tf-motion-fast) var(--tf-easing), color var(--tf-motion-fast) var(--tf-easing); }
.woocommerce-account :is(button.button, .button):hover { background: var(--tf-inverse); border-color: var(--tf-inverse); color: var(--tf-on-inverse); }
.woocommerce-account .woocommerce-form-login__submit,
.woocommerce-account .woocommerce-form-register__submit { inline-size: 100%; background: var(--tf-accent); border-color: var(--tf-accent); color: var(--tf-on-accent); }
.woocommerce-account .woocommerce-form-login__submit:hover,
.woocommerce-account .woocommerce-form-register__submit:hover { background: var(--tf-accent-hover); border-color: var(--tf-accent-hover); color: var(--tf-on-accent); }
.woocommerce-account .woocommerce-form-login__submit:focus-visible,
.woocommerce-account .woocommerce-form-register__submit:focus-visible { outline-offset: 3px; box-shadow: 0 0 0 2px var(--tf-surface); }
.woocommerce-account .form-row { margin: 0; }
.woocommerce-account .form-row label { display: block; margin-block-end: var(--tf-space-1); font-size: var(--tf-size-small); font-weight: 600; }
.woocommerce-account .form-row .required { color: var(--tf-accent); text-decoration: none; }
.woocommerce-account .woocommerce-input-wrapper { display: block; }
/* Поля лише всередині обгортки WooCommerce: пошук у шапці та футер мають власні примітиви. */
.woocommerce-account .woocommerce :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="hidden"]), select, textarea) { inline-size: 100%; min-block-size: var(--tf-control); padding: var(--tf-space-2) var(--tf-space-4); border: var(--tf-bw-control) solid var(--tf-control-border); border-radius: var(--tf-radius-m); background: var(--tf-surface); color: var(--tf-text); font: inherit; }
.woocommerce-account .woocommerce :is(input, select, textarea):focus-visible { border-color: var(--tf-text); }
.woocommerce-account .woocommerce input[type="checkbox"] { inline-size: 1.25rem; block-size: 1.25rem; margin: 0; accent-color: var(--tf-text); }
.woocommerce-account .password-input { display: flex; align-items: center; position: relative; }
.woocommerce-account .show-password-input { position: absolute; inset-inline-end: var(--tf-space-1); inset-block: 0; inline-size: var(--tf-target); border: 0; background: transparent; color: var(--tf-text-muted); cursor: pointer; } /* tf-native-exception: transparent — кнопка показу пароля поверх поля. */
.woocommerce-account .show-password-input:hover { color: var(--tf-text); }
.woocommerce-account .form-row .woocommerce-form-login__rememberme { display: flex; align-items: center; gap: var(--tf-space-2); min-block-size: var(--tf-target); margin: 0; font-size: var(--tf-size-small); font-weight: 500; }
.woocommerce-account .woocommerce-privacy-policy-text { font-size: var(--tf-size-caption); color: var(--tf-text-muted); }
.tf-account-cancel { display: inline-flex; align-items: center; min-block-size: var(--tf-target); }
/* base.css: .tf-prose a фарбує в brand і підкреслює всі посилання статей (специфічність вища за примітиви); у кабінеті кнопки та службові посилання мають власний колір. */
.woocommerce-account .tf-prose .tf-button,
.woocommerce-account .tf-prose .tf-order-no,
.woocommerce-account .tf-prose .tf-account-head__back { text-decoration: none; }
.woocommerce-account .tf-prose .tf-button--signal { color: var(--tf-on-accent); }
.woocommerce-account .tf-prose .tf-button--outline { color: var(--tf-text); }
.woocommerce-account .tf-prose .tf-order-no { color: var(--tf-text); }
.woocommerce-account .tf-prose .tf-account-head__back { color: var(--tf-text-muted); }
.woocommerce-account .tf-prose .tf-account-head__back:hover { color: var(--tf-text); }
.woocommerce-account .tf-prose :is(.tf-account-door, .tf-account-help) .tf-text-link { color: var(--tf-on-inverse-brand); }
.woocommerce-account .wc-block-components-notice-banner { display: flex; align-items: flex-start; gap: var(--tf-space-3); }
.woocommerce-account .wc-block-components-notice-banner > svg { flex: none; inline-size: var(--tf-icon); block-size: var(--tf-icon); margin-block-start: 2px; fill: currentColor; color: var(--tf-brand); }
.woocommerce-account .wc-block-components-notice-banner.is-error > svg { color: var(--tf-danger); }
.woocommerce-account .wc-block-components-notice-banner__content { flex: 1 1 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--tf-space-2) var(--tf-space-4); min-inline-size: 0; }
.woocommerce-account .wc-block-components-notice-banner__content .button { min-block-size: var(--tf-control-compact); margin: 0; padding: var(--tf-space-1) var(--tf-space-4); background: var(--tf-surface); border-color: var(--tf-control-border); color: var(--tf-text); font-size: var(--tf-size-small); }

/* ---------- Гість: двері + картка входу ---------- */
.tf-account-door { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; gap: var(--tf-space-5); padding: var(--tf-space-7) var(--tf-space-7) var(--tf-space-6); background: var(--tf-inverse); color: var(--tf-on-inverse); border-radius: var(--tf-radius-l); }
.tf-account-door::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: repeating-linear-gradient(90deg, var(--tf-field-line) 0 1px, transparent 1px 120px); } /* tf-native-exception: transparent — лінії поля, як у хіро головної. */
.tf-account-door__pitch { position: absolute; inset-inline-end: -8.75rem; inset-block-end: -10rem; inline-size: 28.75rem; block-size: 28.75rem; z-index: -1; pointer-events: none; border: var(--tf-bw-control) solid var(--tf-inverse-line); border-radius: var(--tf-radius-round); }
.tf-account-door__pitch::before { content: ""; position: absolute; inset: 9.375rem; border: var(--tf-bw-control) solid var(--tf-inverse-line); border-radius: var(--tf-radius-round); }
.tf-account-door__pitch::after { content: ""; position: absolute; inset-inline-start: 50%; inset-block: -40%; inline-size: var(--tf-bw-control); background: var(--tf-inverse-line); }
.tf-account-door h1 { margin: 0; font-size: clamp(2.125rem, 3.2vw, 2.75rem); font-weight: 800; line-height: var(--tf-lh-display); text-transform: uppercase; }
.tf-account-door h1 em { font-style: normal; color: var(--tf-on-inverse-brand); }
.tf-account-door__lede { margin: 0; font-size: var(--tf-size-lede); color: var(--tf-on-inverse-muted); max-inline-size: 40ch; }
.tf-account-door__list { display: grid; gap: var(--tf-space-3); margin: 0; padding: 0; list-style: none; }
.tf-account-door__list li { display: flex; gap: var(--tf-space-3); align-items: flex-start; font-size: var(--tf-size-small); color: var(--tf-on-inverse-muted); }
.tf-account-door__list .tf-icon { flex: none; margin-block-start: 2px; color: var(--tf-on-inverse-brand); }
.tf-account-door__list b { color: var(--tf-on-inverse); font-weight: 600; }
.tf-account-door__guest { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--tf-space-2) var(--tf-space-4); margin: auto 0 0; padding-block-start: var(--tf-space-5); border-block-start: var(--tf-bw-divider) solid var(--tf-inverse-line); font-size: var(--tf-size-small); color: var(--tf-on-inverse-subtle); }
.tf-account-door__guest .tf-text-link { color: var(--tf-on-inverse-brand); }
.tf-account-door a:focus-visible { outline-color: var(--tf-focus-on-inverse); }
.tf-account-door--compact { gap: var(--tf-space-4); }
.tf-account-door--compact .tf-account-door__guest { padding-block-start: var(--tf-space-4); }
.woocommerce-account:not(.logged-in) div.woocommerce { row-gap: 0; } /* Заголовок і форма входу — одна картка; відступи задають самі блоки. */
.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-notices-wrapper:not(:empty) { margin-block-end: var(--tf-space-4); }
.woocommerce-account:not(.logged-in) :is(.woocommerce, .u-column1, .u-column2) > h2 { margin: 0; padding: var(--tf-space-6) var(--tf-space-6) 0; background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-block-end: 0; border-radius: var(--tf-radius-l) var(--tf-radius-l) 0 0; font-size: var(--tf-size-heading-small); }
.woocommerce-account form.woocommerce-form-login,
.woocommerce-account form.woocommerce-form-register,
.woocommerce-account form.woocommerce-ResetPassword { display: grid; gap: var(--tf-space-4); margin: 0; padding: var(--tf-space-6); background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
.woocommerce-account :is(.woocommerce, .u-column1, .u-column2) > h2 + :is(form.woocommerce-form-login, form.woocommerce-form-register) { padding-block-start: var(--tf-space-4); border-block-start: 0; border-start-start-radius: 0; border-start-end-radius: 0; }
.woocommerce-account form.woocommerce-form-login .form-row:has(.woocommerce-form-login__submit) { display: grid; gap: var(--tf-space-3); }
.woocommerce-account .woocommerce-LostPassword { margin: 0; text-align: center; font-size: var(--tf-size-small); }
.woocommerce-account .woocommerce-LostPassword a { font-weight: 700; color: var(--tf-brand); }
.woocommerce-account form.woocommerce-ResetPassword > p:first-child { margin: 0; font-size: var(--tf-size-small); color: var(--tf-text-muted); }
.woocommerce-account form.woocommerce-ResetPassword .form-row-first { float: none; inline-size: 100%; }
#customer_login { display: grid; gap: var(--tf-space-6); }
.woocommerce-account #customer_login :is(.u-column1, .u-column2) { float: none; inline-size: auto; min-inline-size: 0; }
.woocommerce-account #customer_login::before,
.woocommerce-account #customer_login::after { display: none; } /* tf-native-exception: none — clearfix .col2-set WooCommerce не потрібен у grid (інакше порожні рядки сітки). */
/* Реєстрація (D-08): підказка під входом веде якорем до нативної форми; пояснення про пароль і політику — дрібним текстом. */
.tf-account-alt { display: flex; flex-wrap: wrap; gap: var(--tf-space-1) var(--tf-space-2); margin: 0; padding-block-start: var(--tf-space-4); border-block-start: var(--tf-bw-divider) solid var(--tf-border); font-size: var(--tf-size-small); color: var(--tf-text-muted); }
.tf-account-alt .tf-text-link { font-weight: 700; color: var(--tf-brand); }
.woocommerce-account form.woocommerce-form-register > p:not(.form-row),
.woocommerce-account .woocommerce-privacy-policy-text p { margin: 0; font-size: var(--tf-size-small); color: var(--tf-text-muted); }
.woocommerce-account .woocommerce-privacy-policy-text a { color: var(--tf-brand); font-weight: 700; }
.woocommerce-account form.woocommerce-form-register:focus:not(:focus-visible) { outline: none; } /* Фокус після якоря «Створити акаунт»: далі Tab веде в поле e-mail. */
.woocommerce-account form.woocommerce-form-register { scroll-margin-block-start: calc(var(--tf-header-h) + var(--tf-space-8)); }

/* ---------- Кабінет: сайдбар із профілем і нативна навігація ---------- */
.tf-account-side { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--tf-space-5); min-inline-size: 0; }
.tf-account-who { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: var(--tf-space-1) var(--tf-space-3); align-items: center; padding: var(--tf-space-1) var(--tf-space-1) var(--tf-space-4); border-block-end: var(--tf-bw-divider) solid var(--tf-border); }
.tf-account-who__avatar { display: grid; place-items: center; inline-size: 3rem; block-size: 3rem; border-radius: var(--tf-radius-dot); background: var(--tf-inverse); color: var(--tf-on-inverse); font-family: var(--tf-font-display); font-size: var(--tf-size-small); font-weight: 700; letter-spacing: 0.02em; }
.tf-account-who__text { display: grid; gap: 2px; min-inline-size: 0; }
.tf-account-who__name { font-weight: 700; line-height: 1.25; }
.tf-account-who__mail { font-size: var(--tf-size-caption); color: var(--tf-text-muted); overflow-wrap: anywhere; }
.tf-account-who__tier { grid-column: 1 / -1; justify-self: start; padding: var(--tf-space-1) var(--tf-space-2); border: var(--tf-bw-divider) solid currentColor; font-family: var(--tf-font-mono); font-size: var(--tf-size-label); letter-spacing: var(--tf-ls-mono); text-transform: uppercase; }
/* Клієнт і дропу, і опту (плагін teamfootball-b2b): перемикач, за якими цінами він зараз купує. */
.tf-account-tier { grid-column: 1 / -1; display: grid; gap: var(--tf-space-2); margin: 0; }
.tf-account-tier__label { font-family: var(--tf-font-mono); font-size: var(--tf-size-label); letter-spacing: var(--tf-ls-mono); text-transform: uppercase; color: var(--tf-text-muted); }
.tf-account-tier__options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: var(--tf-bw-control) solid var(--tf-text); }
.tf-account-tier__option { min-block-size: var(--tf-target); margin: 0; padding: 0 var(--tf-space-3); border: 0; border-radius: 0; background: transparent; color: var(--tf-text); font: inherit; font-weight: 700; cursor: pointer; }
.tf-account-tier__option:hover { background: var(--tf-surface-subtle); }
.tf-account-tier__option[aria-pressed="true"] { background: var(--tf-inverse); color: var(--tf-on-inverse); }
.tf-account-tier__option:focus-visible { outline-offset: calc(var(--tf-bw-focus) * -2); }
.tf-account-who__since { grid-column: 1 / -1; font-family: var(--tf-font-mono); font-size: var(--tf-size-label); letter-spacing: var(--tf-ls-mono); text-transform: uppercase; color: var(--tf-text-muted); }
.woocommerce-account .woocommerce-MyAccount-navigation ul { position: relative; display: grid; gap: var(--tf-space-1); margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li { margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation a { display: flex; align-items: center; gap: var(--tf-space-3); min-block-size: var(--tf-control); padding: var(--tf-space-2) var(--tf-space-4); border-radius: var(--tf-radius-pill); font-weight: 600; color: var(--tf-text); text-decoration: none; white-space: nowrap; }
.woocommerce-account .woocommerce-MyAccount-navigation a:hover { background: var(--tf-surface-subtle); }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { background: var(--tf-text); color: var(--tf-on-inverse); text-decoration: none; }
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout { margin-block-start: var(--tf-space-2); padding-block-start: var(--tf-space-2); border-block-start: var(--tf-bw-divider) solid var(--tf-border); }
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a { color: var(--tf-text-muted); }
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a:hover { color: var(--tf-text); }

/* ---------- Статус замовлення: крапка кольору + завжди текст ---------- */
.tf-order-status { display: inline-flex; align-items: center; gap: var(--tf-space-2); padding: var(--tf-space-1) var(--tf-space-3) var(--tf-space-1) var(--tf-space-2); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-pill); background: var(--tf-surface); font-family: var(--tf-font-body); font-size: var(--tf-size-caption); font-weight: 700; line-height: 1.2; white-space: nowrap; }
.tf-order-status::before { content: ""; flex: none; inline-size: 0.5rem; block-size: 0.5rem; border-radius: var(--tf-radius-dot); background: var(--tf-control-border); }
.tf-order-status--processing::before { background: var(--tf-brand); }
.tf-order-status--completed::before { background: var(--tf-success); }
.tf-order-status--pending::before,
.tf-order-status--on-hold::before { background: var(--tf-warning); }
.tf-order-status--cancelled::before,
.tf-order-status--failed::before { background: var(--tf-danger); }
.tf-order-status--refunded::before { background: var(--tf-text-muted); }

/* ---------- Мініатюри позицій ---------- */
.tf-order-thumbs { display: flex; }
.tf-order-thumbs__item { display: grid; place-items: center; inline-size: 2.75rem; block-size: 2.75rem; margin-inline-start: calc(-1 * var(--tf-space-2)); overflow: hidden; border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-s); background: var(--tf-surface); box-shadow: 0 0 0 2px var(--tf-surface); }
.tf-order-thumbs__item:first-child { margin-inline-start: 0; }
.woocommerce-account .tf-order-thumbs__item img { inline-size: 100%; block-size: 100%; object-fit: contain; mix-blend-mode: multiply; }
.tf-order-thumbs__more { font-family: var(--tf-font-mono); font-size: var(--tf-size-label); font-weight: 700; color: var(--tf-text-muted); background: var(--tf-surface-subtle); }

/* ---------- Дашборд: плитки з даними ---------- */
.tf-account-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--tf-space-4); }
.tf-account-tile { display: flex; flex-direction: column; gap: var(--tf-space-3); min-block-size: 12rem; padding: var(--tf-space-5); background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); transition: border-color var(--tf-motion-fast) var(--tf-easing); }
.tf-account-tile:hover { border-color: var(--tf-control-border); }
.tf-account-tile--empty { border-style: dashed; border-color: var(--tf-control-border); background: transparent; } /* tf-native-exception: transparent — порожня плитка на крейді. */
.tf-account-tile__head { display: flex; justify-content: space-between; align-items: center; gap: var(--tf-space-3); }
.tf-account-tile__label { margin: 0; font-family: var(--tf-font-mono); font-size: var(--tf-size-label); font-weight: 700; letter-spacing: var(--tf-ls-mono); text-transform: uppercase; color: var(--tf-text-muted); white-space: nowrap; }
.tf-account-tile__head .tf-text-link { font-size: var(--tf-size-small); white-space: nowrap; }
.tf-account-tile__body { display: grid; gap: var(--tf-space-2); justify-items: start; }
.tf-account-tile__title { margin: 0; font-family: var(--tf-font-display); font-size: var(--tf-size-lede); font-weight: 700; line-height: var(--tf-lh-heading); }
.tf-account-tile__title a { color: inherit; text-decoration: none; } /* tf-native-exception: inherit — номер замовлення успадковує колір заголовка плитки. */
.tf-account-tile__title a:hover { color: var(--tf-brand); }
.tf-account-tile__text { margin: 0; font-size: var(--tf-size-small); line-height: 1.55; }
.tf-account-tile__text b { font-weight: 700; }
.tf-account-muted { display: block; color: var(--tf-text-muted); }
.tf-account-tile__foot { display: flex; justify-content: space-between; align-items: center; gap: var(--tf-space-3); flex-wrap: wrap; margin-block-start: auto; }
.tf-account-tile__sum { font-size: var(--tf-size-body); font-weight: 700; font-variant-numeric: var(--tf-numeric); }
.tf-account-tile__note { font-size: var(--tf-size-caption); color: var(--tf-text-muted); }
.tf-account-continue { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tf-space-4); padding: var(--tf-space-4) var(--tf-space-5); background: var(--tf-surface-subtle); border-radius: var(--tf-radius-l); }
.tf-account-continue p { flex: 1 1 20ch; margin: 0; font-size: var(--tf-size-small); color: var(--tf-text-muted); }
.tf-account-continue__links { display: flex; flex-wrap: wrap; gap: var(--tf-space-2); flex: none; }
.tf-account-continue__links .tf-button { background: var(--tf-surface); }

/* ---------- Замовлення: таблиця ---------- */
.woocommerce-account table.woocommerce-orders-table { inline-size: 100%; margin: 0; border-collapse: separate; border-spacing: 0; table-layout: auto; background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); overflow: hidden; }
.woocommerce-account .woocommerce-orders-table thead th { padding: var(--tf-space-3) var(--tf-space-4); background: var(--tf-canvas); border-block-end: var(--tf-bw-divider) solid var(--tf-border); font-family: var(--tf-font-mono); font-size: var(--tf-size-label); font-weight: 700; letter-spacing: var(--tf-ls-mono); text-transform: uppercase; color: var(--tf-text-muted); text-align: start; }
.woocommerce-account .woocommerce-orders-table tbody :is(th, td) { padding: var(--tf-space-4); border-block-end: var(--tf-bw-divider) solid var(--tf-border); vertical-align: middle; text-align: start; font-size: var(--tf-size-small); font-weight: 400; }
.woocommerce-account .woocommerce-orders-table tbody tr:last-child :is(th, td) { border-block-end: 0; }
.woocommerce-account .woocommerce-orders-table :is(.woocommerce-orders-table__header-order-total, .woocommerce-orders-table__cell-order-total, .woocommerce-orders-table__header-order-actions, .woocommerce-orders-table__cell-order-actions) { text-align: end; }
.tf-order-no { display: inline-grid; gap: 2px; color: var(--tf-text); text-decoration: none; }
.tf-order-no__id { font-family: var(--tf-font-mono); font-size: var(--tf-size-small); font-weight: 700; }
.tf-order-no__date { font-family: var(--tf-font-mono); font-size: var(--tf-size-caption); letter-spacing: 0.02em; color: var(--tf-text-muted); white-space: nowrap; }
.tf-order-no:hover .tf-order-no__id { text-decoration: underline; text-underline-offset: 0.2em; }
.tf-order-items { display: flex; align-items: center; gap: var(--tf-space-3); }
.tf-order-items__count { color: var(--tf-text-muted); white-space: nowrap; }
.tf-order-total { font-size: var(--tf-size-body); font-weight: 700; font-variant-numeric: var(--tf-numeric); white-space: nowrap; }
.woocommerce-account .woocommerce-orders-table__cell-order-actions { white-space: nowrap; }
.woocommerce-account table.woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions .button { display: inline-flex; min-block-size: var(--tf-control-compact); margin: 0 0 0 var(--tf-space-2); padding: var(--tf-space-1) var(--tf-space-4); background: var(--tf-surface); border-color: var(--tf-control-border); color: var(--tf-text); font-size: var(--tf-size-small); }
.woocommerce-account .woocommerce-orders-table__cell-order-actions .button:hover { background: var(--tf-surface); border-color: var(--tf-text); color: var(--tf-text); }
.woocommerce-account .woocommerce-orders-table__cell-order-actions .button.pay { background: var(--tf-accent); border-color: var(--tf-accent); color: var(--tf-on-accent); }
.woocommerce-account .woocommerce-orders-table__cell-order-actions .button.pay:hover { background: var(--tf-accent-hover); border-color: var(--tf-accent-hover); color: var(--tf-on-accent); }
.woocommerce-account .woocommerce-orders-table__cell-order-actions .button.cancel { border-color: transparent; color: var(--tf-text-muted); } /* tf-native-exception: transparent — другорядна дія без рамки. */
.woocommerce-account .woocommerce-orders-table__cell-order-actions .button.cancel:hover { border-color: var(--tf-control-border); color: var(--tf-text); }
.woocommerce-account .woocommerce-pagination { display: flex; justify-content: flex-end; gap: var(--tf-space-2); }
.woocommerce-account .woocommerce-pagination .button { min-block-size: var(--tf-control-compact); padding-inline: var(--tf-space-4); background: var(--tf-surface); border-color: var(--tf-control-border); color: var(--tf-text); font-size: var(--tf-size-small); }
.woocommerce-account .woocommerce-pagination .button:hover { background: var(--tf-surface); border-color: var(--tf-text); color: var(--tf-text); }

/* ---------- Замовлення: порожній стан ---------- */
.tf-account-empty { display: grid; gap: var(--tf-space-3); justify-items: start; max-inline-size: 40rem; padding: var(--tf-space-7); background: var(--tf-surface); border: var(--tf-bw) dashed var(--tf-control-border); border-radius: var(--tf-radius-l); }
.tf-account-empty h2 { margin: 0; font-size: var(--tf-size-heading-small); }
.tf-account-empty p:not(.tf-eyebrow) { margin: 0; color: var(--tf-text-muted); max-inline-size: 44ch; }
.tf-account-empty__actions { display: flex; flex-wrap: wrap; gap: var(--tf-space-2); margin-block-start: var(--tf-space-2); }
.tf-account-empty + :is(.wc-block-components-notice-banner, .woocommerce-info) { display: none; } /* tf-native-exception: none — нативне «замовлень ще немає» дублює порожній стан теми. */

/* ---------- Деталі замовлення ---------- */
.tf-account--view-order .woocommerce-MyAccount-content > p:first-of-type { margin: 0; font-size: var(--tf-size-small); color: var(--tf-text-muted); }
.tf-account--view-order .woocommerce-MyAccount-content > p:first-of-type mark { background: transparent; color: var(--tf-text); font-weight: 600; } /* tf-native-exception: transparent — <mark> WooCommerce без жовтого фону. */
.tf-order-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: var(--tf-space-5) var(--tf-space-5) var(--tf-space-4); list-style: none; background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
.tf-order-steps__step { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: var(--tf-space-2); padding-inline-end: var(--tf-space-4); }
.tf-order-steps__step::after { content: ""; position: absolute; inset-inline: 2.5rem var(--tf-space-2); inset-block-start: calc(1rem - 1px); block-size: 2px; background: var(--tf-border); }
.tf-order-steps__step:last-child::after { display: none; } /* tf-native-exception: none — після останнього кроку лінії немає. */
.tf-order-steps__step.is-done::after { background: var(--tf-inverse); }
.tf-order-steps__dot { position: relative; z-index: 1; display: grid; place-items: center; inline-size: 2rem; block-size: 2rem; border: 2px solid var(--tf-control-border); border-radius: var(--tf-radius-dot); background: var(--tf-surface); color: var(--tf-on-inverse); }
.tf-order-steps__dot .tf-icon { inline-size: 1rem; block-size: 1rem; stroke-width: 2.4; }
.tf-order-steps__step.is-done .tf-order-steps__dot { background: var(--tf-inverse); border-color: var(--tf-inverse); }
.tf-order-steps__step.is-current .tf-order-steps__dot { background: var(--tf-accent); border-color: var(--tf-accent); box-shadow: inset 0 0 0 3px var(--tf-surface); }
.tf-order-steps__body b { display: block; font-size: var(--tf-size-small); font-weight: 700; }
.tf-order-steps__body small { display: block; margin-block-start: 2px; font-family: var(--tf-font-mono); font-size: var(--tf-size-label); letter-spacing: 0.04em; color: var(--tf-text-muted); }
.tf-order-steps__step.is-wait b { color: var(--tf-text-muted); }
.woocommerce-account .woocommerce-order-details { background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); overflow: hidden; }
.woocommerce-account .woocommerce-order-details__title { margin: 0; padding: var(--tf-space-4) var(--tf-space-5); border-block-end: var(--tf-bw-divider) solid var(--tf-border); font-size: var(--tf-size-body); }
.woocommerce-account table.woocommerce-table--order-details { inline-size: 100%; margin: 0; border-collapse: collapse; table-layout: auto; }
.woocommerce-account .woocommerce-table--order-details thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.woocommerce-account .woocommerce-table--order-details tbody td { padding: var(--tf-space-4) var(--tf-space-5); border-block-end: var(--tf-bw-divider) solid var(--tf-border); vertical-align: middle; text-align: start; }
.woocommerce-account .woocommerce-table--order-details td.product-name { font-weight: 600; }
.woocommerce-account .woocommerce-table--order-details td.product-name:has(.tf-order-item__thumb) { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); grid-auto-flow: row dense; column-gap: var(--tf-space-4); row-gap: var(--tf-space-1); align-items: start; }
.tf-order-item__thumb { grid-column: 1; grid-row: 1 / span 5; display: grid; place-items: center; inline-size: 4.5rem; block-size: 4.5rem; padding: var(--tf-space-1); overflow: hidden; border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-s); background: var(--tf-surface); }
.woocommerce-account .tf-order-item__thumb img { inline-size: 100%; block-size: 100%; object-fit: contain; mix-blend-mode: multiply; }
.woocommerce-account .woocommerce-table--order-details .product-quantity { font-size: var(--tf-size-small); font-weight: 500; color: var(--tf-text-muted); }
.woocommerce-account .woocommerce-table--order-details .wc-item-meta { display: flex; flex-wrap: wrap; gap: var(--tf-space-1); margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-table--order-details .wc-item-meta li { display: inline-flex; gap: 0.35em; align-items: baseline; margin: 0; padding: 2px var(--tf-space-2); border-radius: var(--tf-radius-s); background: var(--tf-surface-subtle); font-family: var(--tf-font-mono); font-size: var(--tf-size-label); font-weight: 700; letter-spacing: var(--tf-ls-mono); }
.woocommerce-account .woocommerce-table--order-details .wc-item-meta p { display: inline; margin: 0; }
.woocommerce-account .woocommerce-table--order-details .wc-item-meta-label { font-weight: 500; color: var(--tf-text-muted); }
.tf-order-item__surfaces { display: flex; flex-wrap: wrap; gap: var(--tf-space-1); }
.woocommerce-account .woocommerce-table--order-details td.product-total { font-weight: 700; font-variant-numeric: var(--tf-numeric); text-align: end; white-space: nowrap; }
.woocommerce-account .woocommerce-table--order-details tfoot { background: var(--tf-canvas); }
.woocommerce-account .woocommerce-table--order-details tfoot :is(th, td) { padding: var(--tf-space-2) var(--tf-space-5); border: 0; font-size: var(--tf-size-small); }
.woocommerce-account .woocommerce-table--order-details tfoot th { font-weight: 400; color: var(--tf-text-muted); text-align: start; }
.woocommerce-account .woocommerce-table--order-details tfoot td { text-align: end; font-variant-numeric: var(--tf-numeric); }
.woocommerce-account .woocommerce-table--order-details tfoot tr:first-child :is(th, td) { padding-block-start: var(--tf-space-4); }
.woocommerce-account .woocommerce-table--order-details tfoot tr:last-child :is(th, td) { padding-block-end: var(--tf-space-5); }
.woocommerce-account .woocommerce-table--order-details tfoot tr:has(.tf-order-grand) :is(th, td) { padding-block-start: var(--tf-space-3); border-block-start: var(--tf-bw-divider) dashed var(--tf-border); }
.woocommerce-account .woocommerce-table--order-details tfoot tr:has(.tf-order-grand) th { font-weight: 700; color: var(--tf-text); }
.tf-order-grand { font-family: var(--tf-font-money); font-size: var(--tf-size-price); font-weight: 700; }
.woocommerce-account .woocommerce-table--order-details tfoot .order-actions-button { min-block-size: var(--tf-control-compact); margin: 0 0 0 var(--tf-space-2); padding: var(--tf-space-1) var(--tf-space-4); background: var(--tf-surface); border-color: var(--tf-control-border); color: var(--tf-text); font-size: var(--tf-size-small); }
.woocommerce-account .woocommerce-table--order-details tfoot .order-actions-button.pay { background: var(--tf-accent); border-color: var(--tf-accent); color: var(--tf-on-accent); }
.woocommerce-account .woocommerce-customer-details { display: grid; gap: var(--tf-space-4); align-content: start; }
.woocommerce-account .woocommerce-customer-details .woocommerce-columns--addresses { display: grid; gap: var(--tf-space-4); }
.woocommerce-account .woocommerce-customer-details .woocommerce-column,
.woocommerce-account .woocommerce-customer-details > .woocommerce-column__title,
.woocommerce-account .woocommerce-customer-details > address { background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); }
.woocommerce-account .woocommerce-customer-details .woocommerce-column { padding: var(--tf-space-4) var(--tf-space-5) var(--tf-space-5); border-radius: var(--tf-radius-l); }
.woocommerce-account .woocommerce-customer-details > .woocommerce-column__title { padding: var(--tf-space-4) var(--tf-space-5) 0; border-block-end: 0; border-start-start-radius: var(--tf-radius-l); border-start-end-radius: var(--tf-radius-l); }
.woocommerce-account .woocommerce-customer-details > address { margin-block-start: calc(-1 * var(--tf-space-4)); padding: 0 var(--tf-space-5) var(--tf-space-5); border-block-start: 0; border-end-start-radius: var(--tf-radius-l); border-end-end-radius: var(--tf-radius-l); }
.woocommerce-account .woocommerce-customer-details .woocommerce-column__title { margin: 0 0 var(--tf-space-2); font-weight: 700; font-family: var(--tf-font-mono); font-size: var(--tf-size-label); font-weight: 700; letter-spacing: var(--tf-ls-mono); text-transform: uppercase; color: var(--tf-text-muted); }
.woocommerce-account .woocommerce-customer-details address { margin: 0; font-style: normal; font-size: var(--tf-size-small); line-height: 1.6; }
.woocommerce-account .woocommerce-customer-details address p { margin: var(--tf-space-1) 0 0; }
.tf-account-help { display: grid; gap: var(--tf-space-2); padding: var(--tf-space-5); background: var(--tf-inverse); color: var(--tf-on-inverse); border-radius: var(--tf-radius-l); }
.tf-account-help__label { margin: 0; font-family: var(--tf-font-mono); font-size: var(--tf-size-label); font-weight: 700; letter-spacing: var(--tf-ls-mono); text-transform: uppercase; color: var(--tf-on-inverse-subtle); }
.tf-account-help p { margin: 0; font-size: var(--tf-size-small); color: var(--tf-on-inverse-muted); }
.tf-account-help .tf-text-link { color: var(--tf-on-inverse-brand); }
.tf-account-help .tf-telegram-link { justify-self: start; }
.tf-account-help a:focus-visible { outline-color: var(--tf-focus-on-inverse); }
.woocommerce-account .woocommerce-OrderUpdates { display: grid; gap: var(--tf-space-3); margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-OrderUpdate { padding: var(--tf-space-4); background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-m); }
.woocommerce-account .woocommerce-OrderUpdate-meta { margin: 0 0 var(--tf-space-1); font-family: var(--tf-font-mono); font-size: var(--tf-size-caption); color: var(--tf-text-muted); }

/* ---------- Адреси ---------- */
.tf-account--edit-address .woocommerce-MyAccount-content > p:empty { display: none; } /* tf-native-exception: none — опис адрес рендерить заголовок екрана. */
.woocommerce-account .woocommerce-Addresses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--tf-space-4); }
.woocommerce-account .woocommerce-Addresses::before,
.woocommerce-account .woocommerce-Addresses::after { display: none; } /* tf-native-exception: none — clearfix .col2-set WooCommerce не потрібен у grid. */
.woocommerce-account .woocommerce-Address,
.woocommerce-account .woocommerce-Addresses .woocommerce-Address { display: grid; gap: var(--tf-space-3); align-content: start; float: none; inline-size: 100%; padding: var(--tf-space-5); background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
.woocommerce-account .woocommerce-Address:has(.tf-address-empty) { border-style: dashed; border-color: var(--tf-control-border); background: transparent; } /* tf-native-exception: transparent — адресу ще не додано. */
.woocommerce-account .woocommerce-Address-title { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--tf-space-3); }
.woocommerce-account .woocommerce-Address .woocommerce-Address-title.title::before,
.woocommerce-account .woocommerce-Address .woocommerce-Address-title.title::after { display: none; } /* tf-native-exception: none — clearfix WooCommerce став би flex-елементом і зсував назву. */
.woocommerce-account .woocommerce-Address-title h2 { margin: 0; font-size: var(--tf-size-lede); }
.woocommerce-account .woocommerce-Address-title .edit { display: inline-flex; align-items: center; min-block-size: var(--tf-control-compact); padding: var(--tf-space-1) var(--tf-space-4); border: var(--tf-bw-control) solid var(--tf-control-border); border-radius: var(--tf-radius-pill); font-size: var(--tf-size-small); font-weight: 700; color: var(--tf-text); text-decoration: none; }
.woocommerce-account .woocommerce-Address-title .edit:hover { border-color: var(--tf-text); }
.woocommerce-account .woocommerce-Address address { margin: 0; font-style: normal; font-size: var(--tf-size-small); line-height: 1.6; }
.woocommerce-account .woocommerce-Address:has(.tf-address-empty) address { color: var(--tf-text-muted); }

/* ---------- Форми адрес і профілю ---------- */
.tf-account--edit-address .woocommerce-MyAccount-content > form,
.woocommerce-account .woocommerce-EditAccountForm { display: flex; flex-wrap: wrap; gap: var(--tf-space-4); max-inline-size: 45rem; margin: 0; padding: var(--tf-space-6); background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
.tf-account--edit-address .woocommerce-MyAccount-content > form > h2 { flex: 1 1 100%; margin: 0; font-size: var(--tf-size-heading-small); }
.woocommerce-account .woocommerce-address-fields { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tf-space-4); flex: 1 1 100%; }
.woocommerce-account .woocommerce-address-fields__field-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--tf-space-4); flex: 1 1 100%; }
.woocommerce-account .woocommerce-address-fields__field-wrapper .form-row { float: none; inline-size: auto; }
.woocommerce-account .woocommerce-address-fields__field-wrapper .form-row-wide { grid-column: 1 / -1; }
.woocommerce-account .woocommerce-address-fields > p:last-child { order: 1; margin: 0; }
.woocommerce-account .woocommerce-address-fields > .tf-account-cancel { order: 2; }
.woocommerce-account .woocommerce-EditAccountForm > .form-row-first,
.woocommerce-account .woocommerce-EditAccountForm > .form-row-last { flex: 1 1 calc(50% - var(--tf-space-4)); float: none; inline-size: auto; }
.woocommerce-account .woocommerce-EditAccountForm > .form-row-wide { flex: 1 1 100%; }
.woocommerce-account .woocommerce-EditAccountForm fieldset { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--tf-space-4); flex: 1 1 100%; min-inline-size: 0; margin: var(--tf-space-2) 0 0; padding: var(--tf-space-5) 0 0; border: 0; border-block-start: var(--tf-bw-divider) solid var(--tf-border); }
.woocommerce-account .woocommerce-EditAccountForm legend { float: inline-start; grid-column: 1 / -1; inline-size: 100%; margin: 0; padding: 0; font-family: var(--tf-font-display); font-size: var(--tf-size-body); font-weight: 700; }
.woocommerce-account .woocommerce-EditAccountForm fieldset > .form-row:first-of-type { grid-column: 1 / -1; }
.woocommerce-account .woocommerce-EditAccountForm > p:last-of-type { flex: 0 0 auto; margin: 0; }
.woocommerce-account .woocommerce-EditAccountForm > .tf-account-cancel { align-self: center; }
.woocommerce-account #account_display_name_description em { display: block; margin-block-start: var(--tf-space-1); font-style: normal; font-size: var(--tf-size-caption); color: var(--tf-text-muted); }

/* ---------- Бонуси (плагін teamfootball-loyalty): смуга дашборду, екран, рядок у замовленні ---------- */
.tf-bonus-strip { display: grid; gap: var(--tf-space-4); padding: var(--tf-space-5); background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
.tf-bonus-strip__head { display: flex; justify-content: space-between; align-items: center; gap: var(--tf-space-3); }
.tf-prose h2.tf-account-tile__label { margin: 0; font-size: var(--tf-size-label); line-height: var(--tf-lh-body); }
.tf-bonus-strip__head .tf-text-link { font-size: var(--tf-size-small); white-space: nowrap; }
.tf-bonus-figures { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--tf-space-3) var(--tf-space-7); margin: 0; padding: 0; list-style: none; }
.tf-bonus-figure { display: grid; gap: 2px; margin: 0; }
.tf-bonus-figure__value { font-family: var(--tf-font-display); font-size: var(--tf-size-lede); font-weight: 700; line-height: var(--tf-lh-heading); font-variant-numeric: var(--tf-numeric); }
.tf-bonus-figure--main .tf-bonus-figure__value { font-size: var(--tf-size-heading); font-weight: 800; letter-spacing: var(--tf-ls-heading); line-height: 1; }
.tf-bonus-figure__label { font-size: var(--tf-size-caption); color: var(--tf-text-muted); }
.tf-bonus-note { display: flex; align-items: flex-start; gap: var(--tf-space-3); margin: 0; padding-block-start: var(--tf-space-4); border-block-start: var(--tf-bw-divider) solid var(--tf-border); font-size: var(--tf-size-small); color: var(--tf-text-muted); }
.tf-bonus-note .tf-icon { flex: none; margin-block-start: 2px; color: var(--tf-brand); }
.tf-bonus-note b { color: var(--tf-text); font-weight: 700; }
.tf-bonus-note--order { margin-block-start: var(--tf-space-4); padding: var(--tf-space-4) var(--tf-space-5); background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
.tf-bonus-note--order > span { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tf-space-2) var(--tf-space-3); }
.tf-bonus-note--order .tf-text-link { font-size: var(--tf-size-small); }
.tf-bonus-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: var(--tf-space-4); }
.tf-bonus-stat { display: grid; gap: var(--tf-space-2); align-content: start; padding: var(--tf-space-5); background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
.tf-bonus-stat--main { background: var(--tf-canvas); border-color: var(--tf-control-border); }
.tf-bonus-stat p { margin: 0; }
.tf-bonus-stat__value { font-family: var(--tf-font-display); font-size: var(--tf-size-heading-small); font-weight: 700; line-height: var(--tf-lh-heading); font-variant-numeric: var(--tf-numeric); }
.tf-bonus-stat--main .tf-bonus-stat__value { font-size: var(--tf-size-heading); font-weight: 800; letter-spacing: var(--tf-ls-heading); line-height: 1; }
.tf-bonus-stat__text { font-size: var(--tf-size-small); color: var(--tf-text-muted); }
.tf-bonus-next { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tf-space-3) var(--tf-space-4); padding: var(--tf-space-4) var(--tf-space-5); background: var(--tf-surface-subtle); border-radius: var(--tf-radius-l); }
.tf-bonus-next__rate { font-family: var(--tf-font-display); font-size: var(--tf-size-lede); font-weight: 800; color: var(--tf-brand); }
.tf-bonus-next p { flex: 1 1 24ch; margin: 0; font-size: var(--tf-size-small); color: var(--tf-text-muted); }
.tf-bonus-next p b { color: var(--tf-text); }
.tf-bonus-next .tf-button { background: var(--tf-surface); }
.woocommerce-account table.tf-bonus-ledger { inline-size: 100%; margin: 0; border-collapse: separate; border-spacing: 0; background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
.tf-bonus-ledger caption { caption-side: top; padding-block-end: var(--tf-space-3); font-family: var(--tf-font-display); font-size: var(--tf-size-lede); font-weight: 700; text-align: start; }
.woocommerce-account .tf-bonus-ledger thead th { padding: var(--tf-space-3) var(--tf-space-4); background: var(--tf-canvas); border-block-end: var(--tf-bw-divider) solid var(--tf-border); font-family: var(--tf-font-mono); font-size: var(--tf-size-label); font-weight: 700; letter-spacing: var(--tf-ls-mono); text-transform: uppercase; color: var(--tf-text-muted); text-align: start; }
.woocommerce-account .tf-bonus-ledger thead th:first-child { border-start-start-radius: var(--tf-radius-l); }
.woocommerce-account .tf-bonus-ledger thead th:last-child { border-start-end-radius: var(--tf-radius-l); }
.woocommerce-account .tf-bonus-ledger tbody td { padding: var(--tf-space-3) var(--tf-space-4); border-block-end: var(--tf-bw-divider) solid var(--tf-border); vertical-align: middle; font-size: var(--tf-size-small); text-align: start; }
.woocommerce-account .tf-bonus-ledger tbody tr:last-child td { border-block-end: 0; }
.woocommerce-account .tf-bonus-ledger :is(th, td).tf-bonus-ledger__amount { text-align: end; }
.tf-bonus-ledger__date { font-family: var(--tf-font-mono); font-size: var(--tf-size-caption); color: var(--tf-text-muted); white-space: nowrap; }
.tf-bonus-ledger__op b { display: block; font-weight: 600; }
.tf-bonus-ledger :is(.tf-bonus-ledger__op, .tf-bonus-ledger__state) small { display: block; margin-block-start: 2px; font-size: var(--tf-size-caption); color: var(--tf-text-muted); }
.woocommerce-account .tf-prose .tf-bonus-ledger__op a { font-weight: 700; color: var(--tf-brand); }
.tf-bonus-amount { font-family: var(--tf-font-mono); font-size: var(--tf-size-body); font-weight: 700; font-variant-numeric: var(--tf-numeric); white-space: nowrap; }
.tf-bonus-amount.is-plus { color: var(--tf-success); }
.tf-bonus-amount.is-muted { color: var(--tf-text-muted); }
.tf-bonus-state--available::before { background: var(--tf-success); }
.tf-bonus-state--pending::before { background: var(--tf-warning); }
.tf-bonus-state--void::before { background: var(--tf-danger); }
.tf-bonus-state--spent::before { background: var(--tf-text); }
.tf-bonus-state--expired::before { background: var(--tf-text-muted); }
.tf-bonus-rules { display: grid; gap: var(--tf-space-3); }
.tf-bonus-rules h2 { margin: 0; font-size: var(--tf-size-lede); }
.tf-bonus-rules dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: var(--tf-bw); margin: 0; overflow: hidden; background: var(--tf-border); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
.tf-bonus-rules dl > div { display: grid; gap: var(--tf-space-1); align-content: start; padding: var(--tf-space-4) var(--tf-space-5); background: var(--tf-surface); }
.tf-bonus-rules dt { font-family: var(--tf-font-display); font-size: var(--tf-size-body); font-weight: 700; }
.tf-bonus-rules dd { margin: 0; font-size: var(--tf-size-small); color: var(--tf-text-muted); }

/* ---------- Розкладка: wide ---------- */
@media (min-width: 48rem) {
	.woocommerce-account.logged-in .woocommerce { grid-template-columns: 16.25rem minmax(0, 1fr); column-gap: var(--tf-space-8); align-items: start; }
	.woocommerce-account.logged-in .tf-account-side { position: sticky; inset-block-start: calc(var(--tf-header-h) + var(--tf-space-4)); }
}
@media (min-width: 64rem) {
	.woocommerce-account:not(.logged-in) .woocommerce:has(.tf-account-door) { grid-template-columns: minmax(0, 1fr) 28.75rem; column-gap: var(--tf-space-6); row-gap: 0; align-items: start; }
	.woocommerce-account:not(.logged-in) .tf-account-door { grid-column: 1; grid-row: 1 / span 4; align-self: stretch; }
}
@media (max-width: 63.99rem) {
	.woocommerce-account:not(.logged-in) .tf-account-door { margin-block-end: var(--tf-space-5); }
}
@container tf-account (min-width: 64rem) {
	.tf-account--view-order .woocommerce-MyAccount-content { grid-template-columns: minmax(0, 1fr) 20rem; column-gap: var(--tf-space-6); }
	.tf-account--view-order .woocommerce-MyAccount-content > * { grid-column: 1 / -1; }
	.tf-account--view-order .woocommerce-MyAccount-content > .woocommerce-order-details { grid-column: 1; }
	.tf-account--view-order .woocommerce-MyAccount-content > .woocommerce-customer-details { grid-column: 2; }
}

/* ---------- Розкладка: compact (сайдбар → профіль + ряд чіпів) ---------- */
@media (max-width: 47.99rem) {
	.woocommerce-account .tf-content-main { padding-block: var(--tf-space-5) var(--tf-space-8); }
	.woocommerce-account .woocommerce { gap: var(--tf-space-5); }
	.tf-account-side { gap: var(--tf-space-3); }
	.tf-account-who { grid-template-columns: 2.75rem minmax(0, 1fr); padding-inline: 0; }
	.tf-account-who__avatar { inline-size: 2.75rem; block-size: 2.75rem; }
	.woocommerce-account .woocommerce-MyAccount-navigation ul { display: flex; gap: var(--tf-space-2); overflow-x: auto; scrollbar-width: none; padding-block-end: var(--tf-space-1); scroll-snap-type: x proximity; }
	.woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; } /* tf-native-exception: none — ряд чіпів гортається без смуги прокрутки. */
	.woocommerce-account .woocommerce-MyAccount-navigation li { flex: none; scroll-snap-align: start; }
	.woocommerce-account .woocommerce-MyAccount-navigation a { min-block-size: var(--tf-control-compact); padding-block: 0; border: var(--tf-bw-control) solid var(--tf-border); background: var(--tf-surface); font-size: var(--tf-size-small); }
	.woocommerce-account .woocommerce-MyAccount-navigation .is-active a { border-color: var(--tf-text); }
	.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout { margin: 0; padding: 0; border: 0; }
	.tf-account-head h1 { font-size: var(--tf-size-heading-small); }
	.tf-account-door { padding: var(--tf-space-6) var(--tf-space-5) var(--tf-space-5); gap: var(--tf-space-4); }
	.tf-account-door h1 { font-size: var(--tf-size-heading); }
	.tf-account-door__list { display: none; } /* tf-native-exception: none — на compact форма входу лишається у першому екрані; переваги видно на wide. */
	.tf-account-door__pitch { inset-inline-end: -6rem; inset-block-end: -7rem; inline-size: 18rem; block-size: 18rem; }
	.tf-account-door__pitch::before { inset: 5.5rem; }
	.woocommerce-account:not(.logged-in) :is(.woocommerce, .u-column1, .u-column2) > h2 { padding: var(--tf-space-5) var(--tf-space-4) 0; }
	.woocommerce-account form.woocommerce-form-login,
	.woocommerce-account form.woocommerce-form-register,
	.woocommerce-account form.woocommerce-ResetPassword { padding: var(--tf-space-4); }
}

/* ---------- Контент у вузькій колонці (контейнер .woocommerce-MyAccount-content) ---------- */
@container (max-width: 38rem) {
	.tf-account-tiles { grid-template-columns: minmax(0, 1fr); }
	.tf-account-tile { min-block-size: 0; }
	.tf-account-continue { flex-direction: column; align-items: flex-start; }
	.tf-account-empty { padding: var(--tf-space-5); }
	.tf-account-empty h2 { font-size: var(--tf-size-lede); }
	.tf-bonus-strip { padding: var(--tf-space-4); }
	.tf-bonus-figures { gap: var(--tf-space-3) var(--tf-space-6); }
	.tf-bonus-figure--main .tf-bonus-figure__value,
	.tf-bonus-stat--main .tf-bonus-stat__value { font-size: var(--tf-size-heading-small); }
	.woocommerce-account table.tf-bonus-ledger { display: block; background: transparent; border: 0; border-radius: 0; } /* tf-native-exception: transparent — рядки історії стають окремими картками. */
	.tf-bonus-ledger caption { display: block; }
	.woocommerce-account .tf-bonus-ledger thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	.woocommerce-account .tf-bonus-ledger tbody { display: grid; gap: var(--tf-space-3); }
	.woocommerce-account .tf-bonus-ledger tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--tf-space-2) var(--tf-space-3); padding: var(--tf-space-4); background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
	.woocommerce-account .tf-bonus-ledger tbody td { display: block; padding: 0; border: 0; }
	.woocommerce-account .tf-bonus-ledger tbody td:is(.tf-bonus-ledger__date, .tf-bonus-ledger__state) { grid-column: 1 / -1; }
	.woocommerce-account .tf-bonus-ledger tbody td.tf-bonus-ledger__op { grid-row: 2; }
	.woocommerce-account .tf-bonus-ledger tbody td.tf-bonus-ledger__amount { grid-row: 2; grid-column: 2; align-self: start; }
	.woocommerce-account table.woocommerce-orders-table { background: transparent; border: 0; border-radius: 0; overflow: visible; } /* tf-native-exception: transparent — рядки стають окремими картками. */
	.woocommerce-account .woocommerce-orders-table thead { display: none; } /* tf-native-exception: none — картки замовлень самодостатні без шапки таблиці. */
	.woocommerce-account .woocommerce-orders-table tbody { display: grid; gap: var(--tf-space-3); }
	.woocommerce-account .woocommerce-orders-table tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--tf-space-3); padding: var(--tf-space-4); background: var(--tf-surface); border: var(--tf-bw) solid var(--tf-border); border-radius: var(--tf-radius-l); }
	.woocommerce-account .woocommerce-orders-table tbody :is(th, td) { padding: 0; border: 0; }
	.woocommerce-account .woocommerce-orders-table__cell-order-status { justify-self: end; }
	.woocommerce-account .woocommerce-orders-table__cell-tf-order-items { grid-column: 1 / -1; }
	.woocommerce-account .woocommerce-orders-table__cell-order-total,
	.woocommerce-account .woocommerce-orders-table__cell-order-actions { padding-block-start: var(--tf-space-3); border-block-start: var(--tf-bw-divider) solid var(--tf-border); }
	.woocommerce-account .woocommerce-orders-table__cell-order-total { text-align: start; align-self: center; }
	.woocommerce-account .woocommerce-orders-table__cell-order-actions { white-space: normal; }
	.woocommerce-account .woocommerce-orders-table__cell-order-actions .button { margin: 0 0 0 var(--tf-space-1); }
	.tf-order-steps { grid-template-columns: minmax(0, 1fr); gap: var(--tf-space-4); padding: var(--tf-space-4); }
	.tf-order-steps__step { flex-direction: row; gap: var(--tf-space-3); padding-inline-end: 0; }
	.tf-order-steps__step::after { inset-inline: calc(1rem - 1px) auto; inset-block: 2.25rem calc(-1 * var(--tf-space-4) - 0.25rem); inline-size: 2px; block-size: auto; }
	.tf-order-steps__body b { padding-block-start: 0.3rem; }
	.woocommerce-account .woocommerce-table--order-details tbody td { padding: var(--tf-space-3) var(--tf-space-4); }
	.woocommerce-account .woocommerce-table--order-details td.product-name:has(.tf-order-item__thumb) { grid-template-columns: 3.5rem minmax(0, 1fr); column-gap: var(--tf-space-3); }
	.tf-order-item__thumb { inline-size: 3.5rem; block-size: 3.5rem; }
	.woocommerce-account .woocommerce-table--order-details tfoot :is(th, td) { padding-inline: var(--tf-space-4); }
	.woocommerce-account .woocommerce-Addresses { grid-template-columns: minmax(0, 1fr); }
	.woocommerce-account .woocommerce-Address { padding: var(--tf-space-4); }
	.tf-account--edit-address .woocommerce-MyAccount-content > form,
	.woocommerce-account .woocommerce-EditAccountForm { padding: var(--tf-space-4); }
	.woocommerce-account .woocommerce-address-fields__field-wrapper,
	.woocommerce-account .woocommerce-EditAccountForm fieldset { grid-template-columns: minmax(0, 1fr); }
	.woocommerce-account .woocommerce-EditAccountForm > .form-row-first,
	.woocommerce-account .woocommerce-EditAccountForm > .form-row-last { flex-basis: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.woocommerce-account .woocommerce-MyAccount-navigation ul { scroll-behavior: auto; }
}