/*
  TWP V2 PORTAL — BASE: the customer pages after the website, in the V2 site's material. Presentation only.

  ONE SYSTEM WITH THE V2 SITE AND TWP V2 CHECKOUT. The page faces are the V2 pages' own (Instrument Serif for the voice,
  Manrope for every word read, IBM Plex Mono for labels); the navigation and footer are the V2 site's (chrome.css). The
  ground is the home page's stage held on the pricing state + the grain (as the checkout). The composition is the V2
  doorway sheet (src/components/v2-pages/login/login-page.css, its breakpoints and sizes verbatim): the hairline frame —
  rail · column · rail, a cross tick at each corner of the column — the head, one rule edge to edge of the column, the
  body. Cyan carries STATE only; the ivory pill is a form's one final action; the outline pill everything secondary.

  THE MARKUP IT EXPECTS: what Pat's WordPress prints (captured logged out 2026-10-21): Avada 7.16's skeleton
  (#boxed-wrapper > #wrapper > #main > .fusion-row > #content) and builder boxes, WooCommerce's account templates,
  WishList Member's wlm3 forms, AffiliateWP's forms and dashboard, Contact Form 7, WooCommerce Subscriptions' account
  tables. Screens nobody has captured logged in are styled through those plugins' own class names.

  WHAT IT NEVER DOES: hide a notice, an error or a plugin's message; change a field's name, order or behaviour; set
  `display` on anything a script toggles; reach into an iframe; touch the cart or the checkout (not loaded there).

  SPECIFICITY: inside the page everything is anchored on `.twp-v2-portal #wrapper #main` (two ids beat Avada's and the
  plugins' class rules). Pat's Additional CSS forces fonts with !important on h1–h4, p, a and button: !important answers
  those, the theme's hidden chrome, the cleared grounds and builder inline styles — nowhere a script sets a display.
  Logical properties throughout: the Arabic pages read right to left.
*/

/* ── Faces (self-hosted, OFL — see assets/fonts/LICENSES.md) ───────────────────────────────── */

@font-face {
  font-family: "TWP Manrope";
  src: url("../fonts/manrope-400-700.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "TWP Instrument Serif";
  src: url("../fonts/instrument-serif-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "TWP Plex Mono";
  src: url("../fonts/ibm-plex-mono-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "TWP Plex Mono";
  src: url("../fonts/ibm-plex-mono-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* ── Tokens ─────────────────────────────────────────────────────────────────────────────────── */

body.twp-v2-portal {
  --pt-ivory: #eef1f7;
  --pt-ink-1: rgb(238 241 247 / 0.9);
  --pt-ink-2: rgb(238 241 247 / 0.78);
  --pt-ink-3: rgb(238 241 247 / 0.7);
  --pt-ink-4: rgb(238 241 247 / 0.56);
  --pt-hair: rgb(255 255 255 / 0.08);
  --pt-rule: rgb(255 255 255 / 0.12);
  --pt-rule-strong: rgb(255 255 255 / 0.18);
  --pt-rule-go: rgb(255 255 255 / 0.26);
  --pt-tick: rgb(238 241 247 / 0.5);
  --pt-field: rgb(255 255 255 / 0.05);
  --pt-field-edge: rgb(255 255 255 / 0.06);
  --pt-field-focus: rgb(39 170 225 / 0.085);
  --pt-field-line: rgb(255 255 255 / 0.42);
  --pt-field-hover: rgb(255 255 255 / 0.58);
  --pt-cyan: #27aae1;
  --pt-cyan-soft: rgb(39 170 225 / 0.1);
  --pt-gold: #ffd966;
  --pt-focus: rgb(39 170 225 / 0.75);
  --pt-panel-ground: rgb(255 255 255 / 0.028);
  --pt-glass: rgb(11 23 48 / 0.55);
  --pt-deep: #0b1120;
  --pt-panel: #0f1a31;
  --pt-error: #f4b4a8;
  --pt-error-rule: rgb(244 180 168 / 0.72);
  --pt-error-ground: rgb(244 180 168 / 0.06);
  --pt-sans: "TWP Manrope", "Manrope", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --pt-serif: "TWP Instrument Serif", "Instrument Serif", "Iowan Old Style", Georgia, serif;
  --pt-mono: "TWP Plex Mono", "IBM Plex Mono", ui-monospace, "Cascadia Mono", Menlo, Consolas, monospace;
  --pt-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --pt-ease-io: cubic-bezier(0.65, 0, 0.35, 1);
  --pt-sticky: 80px; /* the V2 bar's band: 56 px floated 24 px down (v2.css --v2-sticky-offset) */

  /* the doorway frame (login-page.css), phones first */
  --pt-gutter: 16px;
  --pt-max: 100%;
  --pt-pad: 0px;
  --pt-pad-y: 24px;
  --pt-split: 0px;
  --pt-fs-h1: 42px;
  --pt-fs-lead: 16.5px;
  --pt-fs-label: 11.5px;
  --pt-fs-row: 16px;
  --pt-row-py: 14px;
  --pt-fs-go: 24px;
  /* the page's own scale */
  --pt-fs-h2: 28px;
  --pt-fs-h3: 22px;
  --pt-fs-flabel: 14.5px;
  --pt-fs-field: 17px;
  --pt-field-h: 50px;
  --pt-fs-body: 15.5px;
  --pt-fs-small: 13.5px;
  --pt-cta-h: 56px;
  --pt-fs-cta: 16px;
  --pt-cta-go: 40px;
  --pt-space: 40px;
  --pt-gap-fields: 20px;
  --pt-measure: 100%;
  --pt-text: 100%;
  --pt-rail: 100%;
}
@media (min-width: 640px) {
  body.twp-v2-portal {
    --pt-gutter: 24px;
    --pt-pad: 32px;
    --pt-pad-y: 32px;
    --pt-fs-h1: 50px;
    --pt-fs-lead: 17px;
    --pt-fs-go: 26px;
    --pt-fs-h2: 30px;
    --pt-fs-flabel: 15px;
    --pt-field-h: 52px;
    --pt-cta-h: 58px;
    --pt-fs-cta: 16.5px;
    --pt-space: 48px;
    --pt-gap-fields: 22px;
    --pt-measure: 560px;
    --pt-text: 720px;
  }
}
@media (min-width: 900px) {
  body.twp-v2-portal {
    --pt-fs-h1: 56px;
  }
}
@media (min-width: 1024px) {
  body.twp-v2-portal {
    --pt-pad: 40px;
    --pt-pad-y: 36px;
    --pt-split: 48px;
    --pt-fs-h1: 60px;
    --pt-fs-go: 28px;
    --pt-fs-h2: 32px;
    --pt-fs-h3: 23px;
    --pt-space: 56px;
    --pt-rail: 236px;
  }
}
@media (min-width: 1280px) {
  body.twp-v2-portal {
    --pt-gutter: 32px;
    --pt-max: 1216px;
    --pt-pad: 48px;
    --pt-pad-y: 40px;
    --pt-split: 56px;
    --pt-fs-h1: 68px;
    --pt-fs-lead: 17.5px;
    --pt-fs-go: 30px;
    --pt-fs-row: 17px;
    --pt-row-py: 16px;
  }
}
@media (min-width: 1440px) {
  body.twp-v2-portal {
    --pt-max: 1296px;
    --pt-pad: 56px;
    --pt-pad-y: 38px;
    --pt-split: 64px;
    --pt-fs-h1: 76px;
    --pt-fs-go: 32px;
    --pt-fs-h2: 34px;
    --pt-fs-h3: 24px;
    --pt-fs-flabel: 15.5px;
    --pt-fs-field: 18px;
    --pt-field-h: 54px;
    --pt-fs-body: 16px;
    --pt-cta-h: 60px;
    --pt-fs-cta: 17px;
    --pt-space: 64px;
    --pt-gap-fields: 24px;
    --pt-measure: 580px;
    --pt-text: 760px;
    --pt-rail: 256px;
  }
}
@media (min-width: 1680px) {
  body.twp-v2-portal {
    --pt-max: 1440px;
    --pt-pad: 64px;
    --pt-pad-y: 40px;
    --pt-fs-h1: 84px;
    --pt-fs-lead: 18.5px;
    --pt-fs-label: 12px;
    --pt-fs-row: 18px;
  }
}
@media (min-width: 1920px) {
  body.twp-v2-portal {
    --pt-max: 1600px;
    --pt-pad: 72px;
    --pt-split: 80px;
    --pt-fs-h1: 90px;
    --pt-fs-go: 36px;
    --pt-fs-h2: 38px;
    --pt-fs-lead: 19px;
    --pt-fs-flabel: 16px;
    --pt-fs-field: 18.5px;
    --pt-field-h: 56px;
    --pt-fs-body: 16.5px;
    --pt-fs-small: 14px;
    --pt-cta-h: 64px;
    --pt-fs-cta: 18px;
    --pt-cta-go: 44px;
    --pt-space: 72px;
    --pt-gap-fields: 26px;
    --pt-measure: 620px;
    --pt-text: 800px;
  }
}
@media (min-width: 2400px) {
  body.twp-v2-portal {
    --pt-max: 1880px;
    --pt-pad: 96px;
    --pt-pad-y: 64px;
    --pt-split: 112px;
    --pt-fs-h1: 112px;
    --pt-fs-lead: 21px;
    --pt-fs-label: 13.5px;
    --pt-fs-row: 20px;
    --pt-row-py: 22px;
    --pt-fs-go: 44px;
    --pt-fs-h2: 42px;
    --pt-fs-body: 17px;
    --pt-fs-small: 15px;
  }
}

/* ── The ground: the stage (fixed, under everything), the grain (over everything, like the site) ─ */

/* The ground colour is html's, under everything. The body stays clear: html has a background, so the body's would not
   pass to the canvas but paint its own box OVER the stage (the stage sits at z-index -1, below in-flow backgrounds). */
html:has(> body.twp-v2-portal) {
  background: #0b1120 !important;
}
body.twp-v2-portal {
  background: transparent !important;
  color: var(--pt-ink-1);
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body.twp-v2-portal .twp-pt-stage {
  position: fixed;
  inset-inline: 0;
  top: 0;
  z-index: -1;
  height: 100vh;
  height: 100lvh;
  overflow: hidden;
  contain: strict;
  pointer-events: none;
}
body.twp-v2-portal .twp-pt-stage > div {
  position: absolute;
  inset: 0;
}
body.twp-v2-portal .twp-pt-stage-css {
  background-color: #000;
  background-image:
    linear-gradient(105deg, #133e5a 0%, #133e5a 45%, #0d1b2e 78%, #0a0f1f 100%),
    url("../img/stage-texture.jpg");
  background-blend-mode: multiply, normal;
  background-size: cover, cover;
  background-position: center, left center;
}
body.twp-v2-portal .twp-pt-stage-still {
  background: url("../img/stage-pricing.jpg") center / cover no-repeat;
}
@media (min-width: 768px) {
  body.twp-v2-portal .twp-pt-stage-still {
    background-image: url("../img/stage-pricing-wide.jpg");
  }
}
body.twp-v2-portal .twp-pt-grain {
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: 0.03;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-size: 256px 256px;
}
@media print, (forced-colors: active) {
  body.twp-v2-portal .twp-pt-stage,
  body.twp-v2-portal .twp-pt-grain {
    display: none;
  }
}
body.twp-v2-portal ::selection {
  background-color: rgb(39 170 225 / 0.3);
  color: #fff;
}

/* ── The theme's chrome steps aside (these pages only): header, title bar, sliding bar, popups, footer ── */

body.twp-v2-portal :is(
  .fusion-tb-header, .fusion-header-wrapper, .fusion-secondary-header, #sliders-container,
  .avada-page-titlebar-wrapper, .fusion-page-title-bar, .fusion-tb-page-title-bar,
  .fusion-tb-footer, .fusion-footer, .fusion-sliding-bar-wrapper, #slidingbar-area, .fusion-sliding-bar-area,
  .to-top-container, #toTop, #splite_popup_box, #splite_curtain, .splite_sideEnquiry,
  .fusion-page-load-link, body > .skip-link
) {
  display: none !important;
}
body.twp-v2-portal :is(#boxed-wrapper, #wrapper, #main, #main > .fusion-row, #content, #content > .post, #content .post-content, #sidebar) {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}
body.twp-v2-portal #wrapper #main *,
body.twp-v2-portal #wrapper #main *::before,
body.twp-v2-portal #wrapper #main *::after {
  box-sizing: border-box;
}
body.twp-v2-portal #wrapper #main .rich-snippet-hidden {
  display: none;
}
/* Builder boxes keep their columns, lose their grounds and their own widths (the frame sets those). */
body.twp-v2-portal #wrapper #main .fusion-fullwidth {
  padding-inline: 0 !important;
  padding-block: 0 !important;
  margin-block: 0 !important;
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  --awb-background-color: transparent !important;
  --awb-background-image: none !important;
}
body.twp-v2-portal #wrapper #main .fusion-fullwidth::before,
body.twp-v2-portal #wrapper #main .fusion-fullwidth::after {
  background: none !important;
}
body.twp-v2-portal #wrapper #main .fusion-fullwidth > .fusion-builder-row {
  max-width: none !important;
}
body.twp-v2-portal #wrapper #main :is(.fusion-column-wrapper, .fusion-layout-column) {
  background: transparent !important;
  box-shadow: none !important;
}

/* ── THE FRAME (login-page.css "The stage and its frame") ─────────────────────────────────────
   The head (printed under the bar) and the body (Avada's #main) are one framed column: the head opens it with the
   frame's top rule and its two upper ticks; #main's row carries the column's two edges down and closes it with the
   bottom rule and the lower ticks. One rule edge to edge of the column separates the head from the body. Phones: no
   frame, the words keep the gutter. */

body.twp-v2-portal .twp-frame-head {
  position: relative;
  display: grid;
  grid-template-columns: minmax(var(--pt-gutter), 1fr) minmax(0, var(--pt-max)) minmax(var(--pt-gutter), 1fr);
  margin-top: calc(var(--pt-sticky) + 12px);
  outline: none;
  font-family: var(--pt-sans);
  color: var(--pt-ivory);
}
@media (min-width: 640px) {
  body.twp-v2-portal .twp-frame-head {
    margin-top: calc(var(--pt-sticky) + 16px);
  }
  body.twp-v2-portal .twp-frame-head::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--pt-rule);
    pointer-events: none;
  }
}
body.twp-v2-portal.admin-bar .twp-frame-head {
  margin-top: calc(var(--pt-sticky) + 16px + var(--wp-admin--admin-bar--height, 0px));
}
body.twp-v2-portal .twp-cell {
  position: relative;
  grid-column: 2;
  min-width: 0;
}
@media (min-width: 640px) {
  body.twp-v2-portal .twp-cell--head,
  body.twp-v2-portal #wrapper #main > .fusion-row {
    background:
      linear-gradient(var(--pt-rule), var(--pt-rule)) left top / 1px 100% no-repeat,
      linear-gradient(var(--pt-rule), var(--pt-rule)) right top / 1px 100% no-repeat !important;
  }
}
/* the rule between the head and the body, edge to edge of the column */
body.twp-v2-portal .twp-cell--head::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--pt-rule);
  pointer-events: none;
}
body.twp-v2-portal .twp-tick {
  display: none;
}
@media (min-width: 640px) {
  body.twp-v2-portal .twp-tick,
  body.twp-v2-portal #wrapper #main > .fusion-row::before,
  body.twp-v2-portal #wrapper #main > .fusion-row::after {
    display: block;
    position: absolute;
    z-index: 1;
    width: 11px;
    height: 11px;
    pointer-events: none;
    background:
      linear-gradient(var(--pt-tick), var(--pt-tick)) center / 1px 100% no-repeat,
      linear-gradient(var(--pt-tick), var(--pt-tick)) center / 100% 1px no-repeat;
  }
  body.twp-v2-portal .twp-tick[data-at="tl"] {
    top: -6px;
    left: -6px;
  }
  body.twp-v2-portal .twp-tick[data-at="tr"] {
    top: -6px;
    right: -6px;
  }
  body.twp-v2-portal #wrapper #main > .fusion-row::before,
  body.twp-v2-portal #wrapper #main > .fusion-row::after {
    content: "" !important;
    top: auto !important;
    bottom: -6px;
    clear: none !important;
  }
  body.twp-v2-portal #wrapper #main > .fusion-row::before {
    left: -6px;
  }
  body.twp-v2-portal #wrapper #main > .fusion-row::after {
    right: -6px;
  }
}
/* the body's column: Avada's row, given the frame's width; the frame's bottom rule under it */
body.twp-v2-portal #wrapper #main {
  position: relative;
  padding: 0 0 calc(var(--pt-space) * 1.25) !important;
  min-height: 0 !important;
}
body.twp-v2-portal #wrapper #main > .fusion-row {
  position: relative;
  box-sizing: border-box;
  width: min(100% - 2 * var(--pt-gutter), var(--pt-max)) !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
}
@media (min-width: 640px) {
  body.twp-v2-portal #wrapper #main::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(var(--pt-space) * 1.25);
    height: 1px;
    background: var(--pt-rule);
    pointer-events: none;
  }
}
body.twp-v2-portal #wrapper #main #content {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.twp-v2-portal #wrapper #main #content > .post,
body.twp-v2-portal #wrapper #main #content .post-content {
  margin: 0 !important;
  padding: 0 !important;
}
/* the layouts without a body wrapper (account, catalog): the column's own padding */
body.twp-v2-portal:is(.twp-pt-l-account, .twp-pt-l-catalog) #wrapper #main #content {
  padding: 28px var(--pt-pad) var(--pt-pad-y) !important;
}
@media (min-width: 640px) {
  body.twp-v2-portal:is(.twp-pt-l-account, .twp-pt-l-catalog) #wrapper #main #content {
    padding-top: 32px !important;
  }
}

/* ── The head (login-page.css "The head") ───────────────────────────────────────────────────── */

body.twp-v2-portal .twp-head {
  padding: var(--pt-pad-y) var(--pt-pad) 28px;
}
body.twp-v2-portal .twp-eyebrow,
body.twp-v2-portal .twp-facts dt {
  margin: 0 !important;
  font-family: var(--pt-mono) !important;
  font-size: var(--pt-fs-label) !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--pt-ink-3) !important;
}
body.twp-v2-portal .twp-head h1.twp-h1 {
  margin: 12px 0 0 !important;
  padding: 0 !important;
  font-family: var(--pt-serif) !important;
  font-size: var(--pt-fs-h1) !important;
  font-weight: 400 !important;
  line-height: 1.02 !important;
  letter-spacing: -0.014em !important;
  text-transform: none !important;
  color: var(--pt-ivory) !important;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
body.twp-v2-portal .twp-head p.twp-lead {
  max-width: 34em;
  margin: 14px 0 0 !important;
  font-family: var(--pt-sans) !important;
  font-size: var(--pt-fs-lead) !important;
  line-height: 1.55 !important;
  color: var(--pt-ink-2) !important;
  text-wrap: pretty;
}
body.twp-v2-portal .twp-head p.twp-lead strong {
  font-weight: 600;
  color: var(--pt-ivory);
}
body.twp-v2-portal .twp-head .twp-lead a,
body.twp-v2-portal .twp-facts a {
  font-family: var(--pt-sans) !important;
  font-weight: 500;
  color: var(--pt-ivory) !important;
  text-decoration: underline !important;
  text-decoration-color: rgb(238 241 247 / 0.32) !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 5px;
  transition: text-decoration-color 200ms var(--pt-ease);
}
body.twp-v2-portal .twp-head .twp-lead a:hover,
body.twp-v2-portal .twp-facts a:hover {
  text-decoration-color: rgb(238 241 247 / 0.75) !important;
}
/* the head's facts (the members area: the username, the membership): the V2 sheet's facts, in a row from 900 px */
body.twp-v2-portal .twp-facts {
  display: grid;
  margin: 24px 0 0 !important;
  padding: 0 !important;
}
body.twp-v2-portal .twp-fact {
  display: grid;
  gap: 6px;
  padding: var(--pt-row-py) 0;
  border-top: 1px solid var(--pt-hair);
}
body.twp-v2-portal .twp-facts dd {
  margin: 0 !important;
  font-family: var(--pt-sans) !important;
  font-size: var(--pt-fs-row);
  line-height: 1.5;
  color: var(--pt-ink-1);
  overflow-wrap: anywhere;
}
@media (min-width: 900px) {
  body.twp-v2-portal .twp-facts {
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    gap: 32px;
  }
}
body.twp-v2-portal .twp-facts code {
  font-family: var(--pt-mono) !important;
  font-size: 0.94em;
  letter-spacing: 0.02em;
  color: var(--pt-ivory);
  background: none;
  padding: 0;
}
body.twp-v2-portal .twp-fact-note {
  display: inline-block;
  margin-inline-start: 10px;
  font-family: var(--pt-mono) !important;
  font-size: var(--pt-fs-label);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--pt-ink-3);
}
/* a copy control (enhance.js adds the button; the value is always selectable as text) */
body.twp-v2-portal .twp-copy-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  margin-inline-start: 10px;
  padding: 0 12px !important;
  border: 1px solid var(--pt-rule-strong) !important;
  border-radius: 999px !important;
  background: transparent !important;
  font-family: var(--pt-mono) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--pt-ink-2) !important;
  cursor: pointer;
  vertical-align: middle;
}
body.twp-v2-portal .twp-copy-btn:hover {
  border-color: var(--pt-ivory) !important;
  color: var(--pt-ivory) !important;
}
body.twp-v2-portal .twp-copy-btn[data-done] {
  border-color: var(--pt-cyan) !important;
  color: var(--pt-cyan) !important;
}
body.twp-v2-portal .twp-copy-btn:focus-visible {
  outline: 2px solid var(--pt-focus);
  outline-offset: 3px;
}

/* ── The body and its sheet (login-page.css "The body") ─────────────────────────────────────── */

body.twp-v2-portal #wrapper #main .twp-body {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
body.twp-v2-portal #wrapper #main .twp-body-main {
  min-width: 0;
  padding: 28px var(--pt-pad) var(--pt-pad-y);
}
@media (min-width: 640px) {
  body.twp-v2-portal #wrapper #main .twp-body-main {
    padding-top: 32px;
  }
}
body.twp-v2-portal #wrapper #main .twp-sheet {
  position: relative;
  min-width: 0;
  padding: 28px var(--pt-pad) var(--pt-pad-y);
}
/* stacked: the sheet's own rule above it */
body.twp-v2-portal #wrapper #main .twp-sheet::before {
  content: "";
  position: absolute;
  top: 0;
  left: var(--pt-pad);
  right: var(--pt-pad);
  height: 1px;
  background: var(--pt-rule);
}
@media (min-width: 1024px) {
  body.twp-v2-portal #wrapper #main .twp-body.has-sheet {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  }
  body.twp-v2-portal #wrapper #main .twp-body.has-sheet .twp-body-main {
    padding: 36px var(--pt-split) var(--pt-pad-y) var(--pt-pad);
  }
  body.twp-v2-portal #wrapper #main .twp-sheet {
    padding: 36px var(--pt-pad) var(--pt-pad-y) var(--pt-split);
  }
  /* side by side: the split — a hairline from the head's rule down to the frame's bottom */
  body.twp-v2-portal #wrapper #main .twp-sheet::before {
    left: 0;
    right: auto;
    width: 1px;
    height: auto;
    bottom: 0;
  }
}
/* the routes: ruled rows (login-page.css "The routes") */
body.twp-v2-portal #wrapper #main .twp-routes {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
body.twp-v2-portal #wrapper #main .twp-route {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 4px 24px;
  margin: 0 !important;
  padding: calc(var(--pt-row-py) - 10px) 0 !important;
  border-bottom: 1px solid var(--pt-hair);
  font-size: var(--pt-fs-row) !important;
  line-height: 1.4 !important;
  list-style: none !important;
}
body.twp-v2-portal #wrapper #main .twp-route:first-child {
  border-top: 1px solid var(--pt-hair);
}
body.twp-v2-portal #wrapper #main .twp-route::before {
  content: none !important;
}
body.twp-v2-portal #wrapper #main .twp-route-q {
  color: var(--pt-ink-2);
}
body.twp-v2-portal #wrapper #main a.twp-route-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  font-weight: 500;
  color: var(--pt-ivory) !important;
  text-decoration: underline !important;
  text-decoration-color: rgb(238 241 247 / 0.32) !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 6px;
  overflow-wrap: anywhere;
  transition: text-decoration-color 200ms var(--pt-ease);
}
body.twp-v2-portal #wrapper #main a.twp-route-link:hover {
  text-decoration-color: rgb(238 241 247 / 0.75) !important;
}
body.twp-v2-portal #wrapper #main .twp-route-arrow {
  flex: none;
  width: 0.95em;
  height: 0.95em;
  transition: transform 300ms var(--pt-ease);
}
@media (hover: hover) and (pointer: fine) {
  body.twp-v2-portal #wrapper #main a.twp-route-link:hover .twp-route-arrow {
    transform: translateX(3px);
  }
}

/* ── Every word in the V2 faces (Pat's Additional CSS forces Poppins/Inter with !important) ───── */

body.twp-v2-portal #wrapper #main :where(h1, h2, h3, h4, h5, h6, p, a, button, label, span, strong, em, b, small, li, dt, dd, td, th, input, select, textarea, legend, div, address, blockquote, time, fieldset, summary):where(:not(i):not([class*="icon"]):not([class*="fa-"]):not(.dashicons)) {
  font-family: var(--pt-sans) !important;
}
body.twp-v2-portal #wrapper #main {
  font-size: var(--pt-fs-body);
  line-height: 1.6;
  color: var(--pt-ink-1);
}
body.twp-v2-portal #wrapper #main :where(p, li, dd, td, address, blockquote) {
  color: var(--pt-ink-1);
}
body.twp-v2-portal #wrapper #main :where(h1, h2, h3, h4, h5, h6) {
  margin: 0 0 0.6em;
  padding: 0;
  border: 0;
  text-transform: none;
  letter-spacing: -0.005em;
  color: var(--pt-ivory) !important;
}
body.twp-v2-portal #wrapper #main :where(h1, h2) {
  font-family: var(--pt-serif) !important;
  font-weight: 400 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.01em !important;
}
body.twp-v2-portal #wrapper #main :where(h1) {
  font-size: calc(var(--pt-fs-h1) * 0.78) !important;
}
body.twp-v2-portal #wrapper #main :where(h2) {
  font-size: var(--pt-fs-h2) !important;
}
body.twp-v2-portal #wrapper #main :where(h3) {
  font-family: var(--pt-serif) !important;
  font-size: var(--pt-fs-h3) !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
}
body.twp-v2-portal #wrapper #main :where(h4, h5, h6) {
  font-size: 1.05em !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}
body.twp-v2-portal #wrapper #main :where(p) {
  margin: 0 0 1em;
}
body.twp-v2-portal #wrapper #main :where(strong, b) {
  font-weight: 600;
  color: var(--pt-ivory);
}
body.twp-v2-portal #wrapper #main a:where(:not(.button):not(.fusion-button):not(.woocommerce-button):not([class*="btn"]):not([class*="twp-"])) {
  color: var(--pt-ivory) !important;
  text-decoration: underline !important;
  text-decoration-color: rgb(238 241 247 / 0.35) !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px;
  transition: text-decoration-color 160ms var(--pt-ease);
}
body.twp-v2-portal #wrapper #main a:where(:not(.button):not(.fusion-button):not(.woocommerce-button):not([class*="btn"]):not([class*="twp-"])):hover {
  text-decoration-color: var(--pt-ivory) !important;
}
body.twp-v2-portal #wrapper #main :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--pt-focus) !important;
  outline-offset: 3px !important;
}
body.twp-v2-portal #wrapper #main :where(ul, ol) {
  margin: 0 0 1em;
  padding-inline-start: 1.25em;
}
body.twp-v2-portal #wrapper #main :where(ul, ol) li::marker {
  color: var(--pt-ink-3);
}
body.twp-v2-portal #wrapper #main :where(hr) {
  border: 0;
  border-top: 1px solid var(--pt-rule);
  background: none;
}
body.twp-v2-portal #wrapper #main :where(img) {
  max-width: 100%;
  height: auto;
}
body.twp-v2-portal #wrapper #main :where(address) {
  font-style: normal;
}
body.twp-v2-portal #wrapper #main :where(small) {
  font-size: var(--pt-fs-small);
  color: var(--pt-ink-3);
}
body.twp-v2-portal #wrapper #main :where(code, kbd) {
  font-family: var(--pt-mono) !important;
  font-size: 0.92em;
  letter-spacing: 0.02em;
  color: var(--pt-ivory);
  background: rgb(255 255 255 / 0.05);
  padding: 0.08em 0.38em;
  border-radius: 3px;
}
body.twp-v2-portal #wrapper #main :is(.screen-reader-text) {
  color: var(--pt-ivory);
}
body.twp-v2-portal #wrapper #main :is(.clear, .clearboth) {
  display: none;
}

/* ── Fields: label, then the words written on a drawn line (WooCommerce, WishList, AffiliateWP, CF7) ── */

body.twp-v2-portal #wrapper #main :is(input:is([type="text"], [type="email"], [type="tel"], [type="password"], [type="number"], [type="url"], [type="search"], :not([type])), select, textarea),
body.twp-v2-portal #wrapper #main .select2-container .select2-selection--single {
  display: block;
  width: 100%;
  max-width: 100%;
  height: var(--pt-field-h);
  min-height: var(--pt-field-h);
  margin: 0;
  padding: 0 14px;
  border: 0 !important;
  border-bottom: 1px solid var(--pt-field-line) !important;
  border-radius: 2px 2px 0 0 !important;
  background-color: var(--pt-field) !important;
  box-shadow: inset 0 0 0 1px var(--pt-field-edge) !important;
  outline: none;
  font-size: var(--pt-fs-field) !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  letter-spacing: 0;
  text-align: start;
  color: var(--pt-ivory) !important;
  caret-color: var(--pt-cyan);
  transition: border-color 160ms var(--pt-ease), background-color 160ms var(--pt-ease), box-shadow 160ms var(--pt-ease);
  -webkit-appearance: none;
  appearance: none;
}
body.twp-v2-portal #wrapper #main input[type="hidden"] {
  display: none !important;
}
body.twp-v2-portal #wrapper #main textarea {
  height: auto;
  min-height: 140px;
  padding: 14px;
  line-height: 1.5 !important;
  resize: vertical;
}
body.twp-v2-portal #wrapper #main select {
  padding-inline-end: 42px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5.5 8 4.5 4.5L14.5 8' fill='none' stroke='%23eef1f7' stroke-opacity='.7' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 18px 18px !important;
}
body.twp-v2-portal #wrapper #main select option {
  background: var(--pt-panel);
  color: var(--pt-ivory);
}
body.twp-v2-portal #wrapper #main :is(input, textarea)::placeholder {
  color: rgb(238 241 247 / 0.45);
  opacity: 1;
}
body.twp-v2-portal #wrapper #main :is(input:is([type="text"], [type="email"], [type="tel"], [type="password"], [type="number"], [type="url"], [type="search"], :not([type])), select, textarea):hover,
body.twp-v2-portal #wrapper #main .select2-container .select2-selection--single:hover {
  border-bottom-color: var(--pt-field-hover) !important;
}
body.twp-v2-portal #wrapper #main :is(input:is([type="text"], [type="email"], [type="tel"], [type="password"], [type="number"], [type="url"], [type="search"], :not([type])), select, textarea):focus,
body.twp-v2-portal #wrapper #main .select2-container--focus .select2-selection--single,
body.twp-v2-portal #wrapper #main .select2-container--open .select2-selection--single,
body.twp-v2-portal #wrapper #main .select2-container .select2-selection--single:focus {
  border-bottom-color: var(--pt-cyan) !important;
  background-color: var(--pt-field-focus) !important;
  box-shadow: inset 0 0 0 1px rgb(39 170 225 / 0.3), inset 0 -1px 0 var(--pt-cyan) !important;
  outline: none !important;
}
body.twp-v2-portal #wrapper #main :is(input:is([type="text"], [type="email"], [type="tel"], [type="password"], [type="number"], [type="url"], [type="search"], :not([type])), select, textarea):focus-visible {
  outline: none !important;
}
body.twp-v2-portal #wrapper #main :is(input, textarea, select):disabled,
body.twp-v2-portal #wrapper #main :is(input, textarea)[readonly] {
  border-bottom-style: dashed !important;
  color: var(--pt-ink-2) !important;
  cursor: not-allowed;
}
body.twp-v2-portal #wrapper #main input:-webkit-autofill,
body.twp-v2-portal #wrapper #main input:-webkit-autofill:hover,
body.twp-v2-portal #wrapper #main input:-webkit-autofill:focus,
body.twp-v2-portal #wrapper #main select:-webkit-autofill {
  -webkit-text-fill-color: var(--pt-ivory) !important;
  caret-color: var(--pt-cyan);
  box-shadow: inset 0 0 0 100px #111c33 !important;
  transition: background-color 9999s ease-out 0s;
}
/* Labels: the field's name above it, the line it is written on below */
body.twp-v2-portal #wrapper #main :is(.form-row, .wlm3-form-group, .affwp-form p, .wpcf7-form p, .woocommerce-form-row) > label:not(.checkbox):not(.woocommerce-form__label-for-checkbox):not(:has(> input[type="checkbox"], > input[type="radio"])),
body.twp-v2-portal #wrapper #main .affwp-field-label {
  display: block;
  margin: 0 0 8px !important;
  padding: 0 !important;
  font-size: var(--pt-fs-flabel) !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--pt-ink-2) !important;
}
body.twp-v2-portal #wrapper #main :is(.form-row, .wlm3-form-group, .affwp-form p, .wpcf7-form p):focus-within > label,
body.twp-v2-portal #wrapper #main .affwp-form p:focus-within .affwp-field-label {
  color: var(--pt-ivory) !important;
}
body.twp-v2-portal #wrapper #main :is(.required, abbr.required) {
  margin-inline-start: 2px;
  border: 0;
  font-weight: 600;
  text-decoration: none;
  color: var(--pt-ivory);
  visibility: visible;
}
body.twp-v2-portal #wrapper #main .affwp-field-label .required,
body.twp-v2-portal #wrapper #main .optional {
  margin-inline-start: 6px;
  font-family: var(--pt-mono) !important;
  font-size: 0.72em;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--pt-ink-3);
}
/* Checkboxes and radios: the real inputs, drawn in the house's line */
body.twp-v2-portal #wrapper #main :is(input[type="checkbox"], input[type="radio"]) {
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  display: inline-grid;
  place-content: center;
  flex: none;
  width: 20px !important;
  height: 20px !important;
  min-height: 0;
  margin: 0;
  margin-inline-end: 10px;
  padding: 0;
  border: 1.5px solid rgb(238 241 247 / 0.55) !important;
  border-radius: 3px;
  background: transparent !important;
  box-shadow: none !important;
  vertical-align: -4px;
  cursor: pointer;
  transition: border-color 140ms var(--pt-ease), background-color 140ms var(--pt-ease);
}
body.twp-v2-portal #wrapper #main input[type="radio"] {
  border-radius: 50%;
}
body.twp-v2-portal #wrapper #main input[type="checkbox"]:checked {
  border-color: var(--pt-cyan) !important;
  background: var(--pt-cyan) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5 10.5 3.2 3.2L15 6.8' fill='none' stroke='%230b1120' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat !important;
}
body.twp-v2-portal #wrapper #main input[type="radio"]:checked {
  border-color: var(--pt-cyan) !important;
  background: radial-gradient(circle, var(--pt-cyan) 0 4.5px, transparent 5px) !important;
}
body.twp-v2-portal #wrapper #main :is(label.checkbox, .woocommerce-form__label-for-checkbox, .wlm3-form-group label:has(> input[type="checkbox"]), .affwp-user-remember, label:has(> input[type="checkbox"])) {
  display: inline-flex !important;
  align-items: flex-start;
  margin: 0 !important;
  font-size: var(--pt-fs-body) !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  color: var(--pt-ink-1) !important;
  cursor: pointer;
}
/* Invalid: the warm line and words */
body.twp-v2-portal #wrapper #main :is(.woocommerce-invalid :is(input, select, textarea), [aria-invalid="true"], .wpcf7-not-valid) {
  border-bottom-color: var(--pt-error-rule) !important;
  box-shadow: inset 0 0 0 1px rgb(244 180 168 / 0.22), inset 0 -1px 0 var(--pt-error-rule) !important;
}
body.twp-v2-portal #wrapper #main :is(.wpcf7-not-valid-tip, .woocommerce-input-wrapper .woocommerce-error, .checkout-inline-error-message, .wlm3-profile-error) {
  position: relative;
  display: block;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  padding-inline-start: 17px !important;
  font-size: var(--pt-fs-small) !important;
  line-height: 1.45 !important;
  color: var(--pt-error) !important;
  background: none !important;
  border: 0 !important;
}
body.twp-v2-portal #wrapper #main :is(.wpcf7-not-valid-tip, .checkout-inline-error-message, .wlm3-profile-error)::before {
  content: "";
  position: absolute;
  top: 0.5em;
  inset-inline-start: 0;
  width: 7px;
  height: 7px;
  background: var(--pt-error);
}
body.twp-v2-portal #wrapper #main .wlm3-profile-ok {
  color: var(--pt-cyan) !important;
}
/* WooCommerce's show-password eye; WishList's own eye (a dashicon) */
body.twp-v2-portal #wrapper #main :is(.password-input, .wishlist-member-login-password) {
  position: relative;
  display: block;
}
body.twp-v2-portal #wrapper #main :is(.password-input, .wishlist-member-login-password) input {
  padding-inline-end: 52px !important;
}
body.twp-v2-portal #wrapper #main .show-password-input {
  position: absolute;
  top: 50%;
  inset-inline-end: 6px;
  width: 40px;
  height: 40px;
  margin: -20px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12Z' fill='none' stroke='%23eef1f7' stroke-opacity='.7' stroke-width='1.5'/%3E%3Ccircle cx='12' cy='12' r='3' fill='none' stroke='%23eef1f7' stroke-opacity='.7' stroke-width='1.5'/%3E%3C/svg%3E") center / 20px 20px no-repeat !important;
  box-shadow: none !important;
  color: transparent !important;
  font-size: 0 !important;
  cursor: pointer;
}
body.twp-v2-portal #wrapper #main .show-password-input::before,
body.twp-v2-portal #wrapper #main .show-password-input::after {
  content: none !important;
}
body.twp-v2-portal #wrapper #main .show-password-input.display-password {
  background-color: rgb(238 241 247 / 0.08) !important;
}
body.twp-v2-portal #wrapper #main .wishlist-member-login-password a.dashicons {
  position: absolute;
  top: 50%;
  inset-inline-end: 10px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  margin-top: -18px;
  border-radius: 999px;
  color: rgb(238 241 247 / 0.7) !important;
  text-decoration: none !important;
  font-size: 20px;
  line-height: 36px;
}
body.twp-v2-portal #wrapper #main .wishlist-member-login-password a.dashicons:hover {
  background: rgb(238 241 247 / 0.08);
  color: var(--pt-ivory) !important;
}
/* Country / State (WooCommerce's selectWoo): a field; its dropdown is appended to <body> */
body.twp-v2-portal #wrapper #main .select2-container {
  width: 100% !important;
}
body.twp-v2-portal #wrapper #main .select2-container .select2-selection--single {
  display: flex;
  align-items: center;
  padding: 0;
}
body.twp-v2-portal #wrapper #main .select2-container .select2-selection__rendered {
  flex: 1;
  padding: 0 42px 0 14px !important;
  line-height: calc(var(--pt-field-h) - 1px) !important;
  color: var(--pt-ivory) !important;
}
body.twp-v2-portal #wrapper #main .select2-container .select2-selection__arrow {
  top: 0 !important;
  right: 12px !important;
  width: 20px !important;
  height: 100% !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5.5 8 4.5 4.5L14.5 8' fill='none' stroke='%23eef1f7' stroke-opacity='.7' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
}
body.twp-v2-portal #wrapper #main .select2-container .select2-selection__arrow b {
  display: none !important;
}
body.twp-v2-portal .select2-container--open .select2-dropdown {
  overflow: hidden;
  border: 1px solid var(--pt-rule-strong) !important;
  border-radius: 2px !important;
  background: var(--pt-panel) !important;
  box-shadow: 0 24px 48px -24px rgb(0 0 0 / 0.7) !important;
  color: var(--pt-ivory) !important;
  font-family: var(--pt-sans) !important;
}
body.twp-v2-portal .select2-container--open .select2-search--dropdown .select2-search__field {
  height: 42px;
  padding: 0 12px;
  border: 0 !important;
  border-bottom: 1px solid var(--pt-field-line) !important;
  background: rgb(255 255 255 / 0.04) !important;
  color: var(--pt-ivory) !important;
  font-family: var(--pt-sans) !important;
  font-size: 16px !important;
}
body.twp-v2-portal .select2-container--open .select2-results__option {
  padding: 9px 14px !important;
  font-family: var(--pt-sans) !important;
  font-size: 15px !important;
  color: var(--pt-ink-1) !important;
  background: transparent !important;
}
body.twp-v2-portal .select2-container--open .select2-results__option--highlighted,
body.twp-v2-portal .select2-container--open .select2-results__option--highlighted[aria-selected] {
  color: #fff !important;
  background: rgb(39 170 225 / 0.2) !important;
}

/* ── Buttons: each form's one final action is the ivory pill; everything else the outline pill ── */

body.twp-v2-portal #wrapper #main :is(a.button, button.button, input.button, .woocommerce-button, .woocommerce-Button, a.fusion-button, button.fusion-button, .wpcf7-submit, input[type="submit"], button[type="submit"], .affwp-copy-button, .wp-block-button__link) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  float: none !important;
  width: auto;
  min-height: 44px;
  height: auto !important;
  margin: 0;
  padding: 0 20px !important;
  border: 1px solid rgb(238 241 247 / 0.32) !important;
  border-radius: 999px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  font-family: var(--pt-sans) !important;
  font-size: var(--pt-fs-small) !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  letter-spacing: 0.01em !important;
  text-align: center;
  text-decoration: none !important;
  text-shadow: none !important;
  text-transform: none !important;
  white-space: nowrap;
  color: var(--pt-ivory) !important;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color 160ms var(--pt-ease), background-color 160ms var(--pt-ease), transform 160ms var(--pt-ease);
}
body.twp-v2-portal #wrapper #main :is(a.button, button.button, input.button, .woocommerce-button, .woocommerce-Button, a.fusion-button, button.fusion-button, input[type="submit"], button[type="submit"]):hover {
  border-color: var(--pt-ivory) !important;
  background: rgb(238 241 247 / 0.06) !important;
}
body.twp-v2-portal #wrapper #main :is(a.button, button.button, input.button, .woocommerce-button, a.fusion-button, input[type="submit"], button[type="submit"]):active {
  transform: translateY(1px);
}
body.twp-v2-portal #wrapper #main .fusion-button .fusion-button-text,
body.twp-v2-portal #wrapper #main .fusion-button i {
  color: inherit !important;
  font-size: inherit;
  line-height: inherit;
}
/* the final action of a form: sign in, redeem, register, save, reset, send */
body.twp-v2-portal #wrapper #main :is(
  form.woocommerce-form-login button[type="submit"],
  form.woocommerce-ResetPassword button[type="submit"],
  form.lost_reset_password button[type="submit"],
  form.woocommerce-EditAccountForm button[type="submit"],
  form.edit-account button[type="submit"],
  .woocommerce-MyAccount-content form button[name="save_address"],
  form[id="add_payment_method"] [id="place_order"],
  .wlm3-form input[type="submit"],
  .wlm_inpageloginform input[type="submit"],
  form.affwp-form input[type="submit"],
  form.wpcf7-form input.wpcf7-submit,
  .twp-btn--go
) {
  position: relative;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
  min-height: var(--pt-cta-h);
  /* the end padding keeps the label clear of the arrow chip: a long label grows the pill, never runs under the chip */
  padding: 0 calc((var(--pt-cta-h) - var(--pt-cta-go)) / 2 + var(--pt-cta-go) + 14px) 0 calc(var(--pt-cta-h) * 0.42) !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #eef1f7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='20' fill='%230b1120'/%3E%3Cpath d='M13.5 20h12.5M21 15.5 25.5 20 21 24.5' fill='none' stroke='%23eef1f7' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat !important;
  background-position: right calc((var(--pt-cta-h) - var(--pt-cta-go)) / 2) center !important;
  background-size: var(--pt-cta-go) var(--pt-cta-go) !important;
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 0.9),
    inset 0 -1px 0 rgb(11 17 32 / 0.16),
    0 1px 0 rgb(0 0 0 / 0.3),
    0 22px 44px -28px rgb(238 241 247 / 0.42) !important;
  font-family: var(--pt-sans) !important;
  font-size: var(--pt-fs-cta) !important;
  font-weight: 600 !important;
  letter-spacing: -0.006em !important;
  text-align: start !important;
  text-decoration: none !important;
  color: #0b1120 !important;
  -webkit-tap-highlight-color: transparent;
}
@media (min-width: 640px) {
  body.twp-v2-portal #wrapper #main :is(
    form.woocommerce-form-login button[type="submit"],
    form.woocommerce-ResetPassword button[type="submit"],
    form.lost_reset_password button[type="submit"],
    form.woocommerce-EditAccountForm button[type="submit"],
    form.edit-account button[type="submit"],
    .woocommerce-MyAccount-content form button[name="save_address"],
    form[id="add_payment_method"] [id="place_order"],
    .wlm3-form input[type="submit"],
    .wlm_inpageloginform input[type="submit"],
    form.affwp-form input[type="submit"],
    form.wpcf7-form input.wpcf7-submit,
    .twp-btn--go
  ) {
    width: auto;
    min-width: 260px;
  }
}
body.twp-v2-portal #wrapper #main :is(
  form.woocommerce-form-login button[type="submit"],
  form.woocommerce-ResetPassword button[type="submit"],
  form.lost_reset_password button[type="submit"],
  form.woocommerce-EditAccountForm button[type="submit"],
  form.edit-account button[type="submit"],
  .woocommerce-MyAccount-content form button[name="save_address"],
  form[id="add_payment_method"] [id="place_order"],
  .wlm3-form input[type="submit"],
  .wlm_inpageloginform input[type="submit"],
  form.affwp-form input[type="submit"],
  form.wpcf7-form input.wpcf7-submit,
  .twp-btn--go
):hover {
  background-color: #fff !important;
}
body.twp-v2-portal #wrapper #main a.twp-btn--go {
  display: inline-flex;
  align-items: center;
}
body.twp-v2-portal #wrapper #main .twp-btn--go svg {
  display: none; /* the drawn arrow chip is the button's background (the forms' own buttons carry no markup for it) */
}
body.twp-v2-portal #wrapper #main .twp-btn--go span {
  color: inherit;
}
/* the outline pill as a link */
body.twp-v2-portal #wrapper #main a.twp-btn--line {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px !important;
  border: 1px solid rgb(238 241 247 / 0.32) !important;
  border-radius: 999px;
  font-size: var(--pt-fs-small) !important;
  font-weight: 600 !important;
  color: var(--pt-ivory) !important;
  text-decoration: none !important;
  white-space: nowrap;
  transition: border-color 160ms var(--pt-ease), background-color 160ms var(--pt-ease);
}
body.twp-v2-portal #wrapper #main a.twp-btn--line:hover {
  border-color: var(--pt-ivory) !important;
  background: rgb(238 241 247 / 0.06);
}
body.twp-v2-portal #wrapper #main :is(button, input[type="submit"], .button):is(:disabled, .disabled, [aria-disabled="true"]) {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  transform: none !important;
}
body.twp-v2-portal #wrapper #main :is(input[type="submit"], button):focus-visible {
  outline: 2px solid var(--pt-focus) !important;
  outline-offset: 4px !important;
}
/* Loading: WooCommerce's BlockUI veil and CF7's spinner, in the ground's colour (the words stay readable) */
body.twp-v2-portal #wrapper #main .blockUI.blockOverlay {
  background: rgb(11 17 32 / 0.6) !important;
  opacity: 1 !important;
}
body.twp-v2-portal #wrapper #main .wpcf7-spinner {
  background-color: var(--pt-ivory) !important;
  opacity: 0.8;
}
body.twp-v2-portal #wrapper #main .wpcf7-spinner::before {
  background-color: var(--pt-deep) !important;
}
body.twp-v2-portal #wrapper #main .affwp-spinner svg {
  color: var(--pt-ivory);
}

/* ── Status: a square mark that carries the state, beside its word (never colour alone) ──────── */

body.twp-v2-portal .twp-status {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: var(--pt-fs-small);
  font-weight: 500;
  line-height: 1.3;
  white-space: nowrap;
  color: var(--pt-ink-1);
}
body.twp-v2-portal .twp-status::before {
  content: "";
  flex: none;
  width: 7px;
  height: 7px;
  background: rgb(238 241 247 / 0.5);
}
body.twp-v2-portal .twp-status--on::before {
  background: var(--pt-cyan);
  box-shadow: 0 0 0 3px rgb(39 170 225 / 0.14);
}
body.twp-v2-portal .twp-status--warn::before {
  background: var(--pt-error);
}
body.twp-v2-portal .twp-status--open::before {
  background: transparent;
  box-shadow: inset 0 0 0 1.5px rgb(238 241 247 / 0.6);
}

/* ── Notices: every plugin's, made intentional — never hidden ───────────────────────────────── */

body.twp-v2-portal #wrapper #main :is(.woocommerce-error, .woocommerce-message, .woocommerce-info, .wc-block-components-notice-banner, .affwp-notice, .affwp-errors, p.affwp-error, .fusion-alert, .wpcf7-response-output) {
  position: relative;
  display: block;
  width: auto;
  margin: 0 0 20px !important;
  padding: 16px 18px !important;
  padding-inline-start: 40px !important;
  border: 1px solid var(--pt-rule) !important;
  border-inline-start: 2px solid rgb(238 241 247 / 0.45) !important;
  border-radius: 0 !important;
  background: rgb(255 255 255 / 0.03) !important;
  box-shadow: none !important;
  list-style: none !important;
  font-size: var(--pt-fs-body) !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  text-align: start !important;
  text-transform: none !important;
  color: var(--pt-ivory) !important;
}
body.twp-v2-portal #wrapper #main :is(.woocommerce-error, .woocommerce-message, .woocommerce-info, .wc-block-components-notice-banner, .affwp-notice, .affwp-errors, p.affwp-error, .fusion-alert, .wpcf7-response-output)::before {
  content: "" !important;
  display: block !important;
  position: absolute;
  top: calc(16px + 0.55em);
  inset-inline-start: 20px;
  width: 7px;
  height: 7px;
  margin: 0;
  background: rgb(238 241 247 / 0.6);
  font-family: inherit !important;
}
body.twp-v2-portal #wrapper #main :is(.woocommerce-error, .woocommerce-message, .woocommerce-info)::after {
  content: none !important;
  display: none !important;
}
body.twp-v2-portal #wrapper #main :is(.woocommerce-error, .wc-block-components-notice-banner.is-error, .affwp-errors, p.affwp-error, .affwp-notice-error, .fusion-alert.alert-danger, .fusion-alert.error, .wpcf7-form.invalid .wpcf7-response-output, .wpcf7-form.failed .wpcf7-response-output, .wpcf7-form.spam .wpcf7-response-output, .wpcf7-form.aborted .wpcf7-response-output) {
  border-color: rgb(244 180 168 / 0.32) !important;
  border-inline-start-color: var(--pt-error-rule) !important;
  background: var(--pt-error-ground) !important;
}
body.twp-v2-portal #wrapper #main :is(.woocommerce-error, .wc-block-components-notice-banner.is-error, .affwp-errors, p.affwp-error, .affwp-notice-error, .fusion-alert.alert-danger, .fusion-alert.error, .wpcf7-form.invalid .wpcf7-response-output, .wpcf7-form.failed .wpcf7-response-output)::before {
  background: var(--pt-error);
}
body.twp-v2-portal #wrapper #main :is(.woocommerce-message, .wc-block-components-notice-banner.is-success, .wpcf7-form.sent .wpcf7-response-output, .fusion-alert.alert-success) {
  border-color: rgb(39 170 225 / 0.3) !important;
  border-inline-start-color: var(--pt-cyan) !important;
  background: rgb(39 170 225 / 0.06) !important;
}
body.twp-v2-portal #wrapper #main :is(.woocommerce-message, .wc-block-components-notice-banner.is-success, .wpcf7-form.sent .wpcf7-response-output, .fusion-alert.alert-success)::before {
  background: var(--pt-cyan);
}
/* an empty CF7 response box (before sending) and an empty notices wrapper stay out of the way, as their plugins mean */
body.twp-v2-portal #wrapper #main .wpcf7-form.init .wpcf7-response-output:empty,
body.twp-v2-portal #wrapper #main .wpcf7-form.init .wpcf7-response-output:has(.fusion-alert-content:empty) {
  display: none !important;
}
body.twp-v2-portal #wrapper #main .woocommerce-notices-wrapper:empty {
  display: none !important;
}
/* consecutive notices read as one stack: one rule between them, not two boxes' gaps */
body.twp-v2-portal #wrapper #main .woocommerce-notices-wrapper > * + * {
  margin-top: -21px !important;
}
body.twp-v2-portal #wrapper #main .woocommerce-error > li {
  position: relative;
  margin: 0 !important;
  padding: 2px 0 !important;
  list-style: none !important;
}
body.twp-v2-portal #wrapper #main .wc-block-components-notice-banner > svg,
body.twp-v2-portal #wrapper #main .fusion-alert .alert-icon {
  display: none !important;
}
body.twp-v2-portal #wrapper #main .wc-block-components-notice-banner__content {
  display: block !important;
  padding: 0 !important;
  color: inherit;
}
body.twp-v2-portal #wrapper #main .fusion-alert :is(.fusion-alert-content-wrapper, .fusion-alert-content) {
  display: block;
  font-size: inherit !important;
  line-height: inherit !important;
  text-align: start !important;
  text-transform: none !important;
  color: inherit !important;
}
body.twp-v2-portal #wrapper #main .fusion-alert .close {
  position: absolute;
  top: 8px;
  inset-inline-end: 8px;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0 !important;
  border-radius: 999px;
  background: transparent !important;
  color: var(--pt-ink-2) !important;
  font-size: 22px !important;
  line-height: 1 !important;
  opacity: 1 !important;
  cursor: pointer;
}
body.twp-v2-portal #wrapper #main .fusion-alert .close:hover {
  background: rgb(238 241 247 / 0.08) !important;
  color: var(--pt-ivory) !important;
}
body.twp-v2-portal #wrapper #main .fusion-alert.alert-dismissable {
  padding-inline-end: 52px !important;
}
body.twp-v2-portal #wrapper #main :is(.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner) :is(.button, .wc-forward) {
  display: inline-flex !important;
  align-items: center;
  float: none !important;
  min-height: 32px !important;
  margin: 0 !important;
  margin-inline-start: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  font-size: inherit !important;
  font-weight: 600 !important;
  line-height: inherit !important;
  text-decoration: underline !important;
  text-decoration-color: rgb(238 241 247 / 0.45) !important;
  text-underline-offset: 3px;
  color: var(--pt-ivory) !important;
}
body.twp-v2-portal #wrapper #main :is(.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner) :is(.button, .wc-forward)::before,
body.twp-v2-portal #wrapper #main :is(.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner) :is(.button, .wc-forward)::after {
  content: none !important; /* Avada's icon glyph: the V2 buttons carry words only */
  display: none !important;
}

/* ── Tables: the ledger — mono column heads, hairlines, figures aligned ──────────────────────── */

body.twp-v2-portal #wrapper #main :is(table.shop_table, table.affwp-table, table.woocommerce-table, .woocommerce-MyAccount-content table) {
  width: 100% !important;
  margin: 0 0 var(--pt-space) !important;
  border: 0 !important;
  border-collapse: collapse !important;
  border-spacing: 0;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: var(--pt-fs-body);
}
body.twp-v2-portal #wrapper #main :is(table.shop_table, table.affwp-table, table.woocommerce-table, .woocommerce-MyAccount-content table) :is(th, td) {
  padding: 16px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--pt-hair) !important;
  background: transparent !important;
  vertical-align: middle;
  text-align: start;
  color: var(--pt-ink-1);
}
body.twp-v2-portal #wrapper #main :is(table.shop_table, table.affwp-table, table.woocommerce-table, .woocommerce-MyAccount-content table) :is(th, td) + :is(th, td) {
  padding-inline-start: 18px !important;
}
body.twp-v2-portal #wrapper #main :is(table.shop_table, table.affwp-table, table.woocommerce-table, .woocommerce-MyAccount-content table) thead th {
  padding-top: 0 !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid var(--pt-rule) !important;
  font-family: var(--pt-mono) !important;
  font-size: var(--pt-fs-label) !important;
  font-weight: 500 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--pt-ink-3) !important;
  white-space: nowrap;
}
body.twp-v2-portal #wrapper #main :is(table.shop_table, table.woocommerce-table) :is(tfoot th, tbody th) {
  font-weight: 500;
  color: var(--pt-ink-2);
}
body.twp-v2-portal #wrapper #main :is(table.shop_table, table.woocommerce-table) tfoot td,
body.twp-v2-portal #wrapper #main :is(.woocommerce-orders-table__cell-order-total, .order-total, .product-total, .woocommerce-table__product-total) {
  font-variant-numeric: tabular-nums;
}
body.twp-v2-portal #wrapper #main :is(table.shop_table, table.woocommerce-table) tfoot tr:last-child :is(th, td) {
  border-bottom-color: var(--pt-rule) !important;
  color: var(--pt-ivory);
  font-weight: 600;
}
body.twp-v2-portal #wrapper #main .woocommerce-Price-amount {
  white-space: nowrap;
  color: inherit;
}
/* A table that is wider than a phone scrolls inside its own box, never the page */
body.twp-v2-portal #wrapper #main :is(.affwp-table-wrap, .woocommerce-MyAccount-content) {
  max-width: 100%;
}
body.twp-v2-portal #wrapper #main .affwp-table-wrap {
  overflow-x: auto;
}

/* ── Builder content (Avada): typography and components; the groups arrange it ──────────────── */

body.twp-v2-portal #wrapper #main .fusion-title {
  margin-bottom: 0.4em !important;
}
body.twp-v2-portal #wrapper #main .fusion-title :is(h1, h2, h3, h4, .fusion-title-heading) {
  font-family: var(--pt-serif) !important;
  font-weight: 400 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  color: var(--pt-ivory) !important;
  text-align: start !important;
}
body.twp-v2-portal #wrapper #main .fusion-title .title-sep-container,
body.twp-v2-portal #wrapper #main .fusion-title .title-sep {
  display: none !important;
}
body.twp-v2-portal #wrapper #main .fusion-text :where(p, li) {
  font-size: var(--pt-fs-body) !important;
  line-height: 1.65 !important;
  color: var(--pt-ink-1) !important;
}
body.twp-v2-portal #wrapper #main .fusion-text :where(h1, h2, h3, h4) {
  color: var(--pt-ivory) !important;
}
body.twp-v2-portal #wrapper #main :is(.fusion-checklist, ul.fusion-checklist) li {
  color: var(--pt-ink-1) !important;
}
body.twp-v2-portal #wrapper #main .fusion-checklist .icon-wrapper,
body.twp-v2-portal #wrapper #main .fusion-li-icon {
  color: var(--pt-cyan) !important;
  background: transparent !important;
}
body.twp-v2-portal #wrapper #main iframe {
  max-width: 100%;
}
body.twp-v2-portal #wrapper #main .fusion-separator,
body.twp-v2-portal #wrapper #main .fusion-separator-border {
  border-color: var(--pt-rule) !important;
}
/* Avada's entrance animations wait for Avada's script; here the content is simply there (the V2 pages' calm) */
body.twp-v2-portal #wrapper #main .fusion-animated {
  visibility: visible !important;
  opacity: 1 !important;
  animation-name: none !important;
  transform: none !important;
}
/* Gutenberg blocks inside builder text (the member pages' "Welcome back!") */
body.twp-v2-portal #wrapper #main .wp-block-heading {
  font-family: var(--pt-serif) !important;
  font-weight: 400 !important;
  font-size: var(--pt-fs-h2) !important;
  color: var(--pt-ivory) !important;
}
body.twp-v2-portal #wrapper #main .wp-block-buttons:empty,
body.twp-v2-portal #wrapper #main .wp-block-columns:not(:has(*:not(.wp-block-column, .wp-block-buttons))) {
  display: none;
}
/* Pat's community block (#discord-sec): the V2 community card — hairline frame, the mark, the count in mono, one action */
body.twp-v2-portal #wrapper #main .discord-sec {
  margin-block: calc(var(--pt-space) * 0.6) !important;
  padding: clamp(22px, 3vw, 36px) !important;
  border: 1px solid var(--pt-rule) !important;
  border-radius: 2px !important;
  background: linear-gradient(120deg, rgb(39 170 225 / 0.1), rgb(255 255 255 / 0.015) 55%) !important;
  background-image: linear-gradient(120deg, rgb(39 170 225 / 0.1), rgb(255 255 255 / 0.015) 55%) !important;
}
body.twp-v2-portal #wrapper #main .discord-sec .fusion-imageframe img {
  max-width: 112px;
  opacity: 0.95;
}
body.twp-v2-portal #wrapper #main .discord-sec .fusion-title :is(h2, h3) {
  font-size: var(--pt-fs-h3) !important;
  line-height: 1.12 !important;
}
body.twp-v2-portal #wrapper #main .discord-sec :is(.fusion-text-4, .fusion-text:last-of-type) p {
  font-family: var(--pt-mono) !important;
  font-size: var(--pt-fs-label) !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pt-ink-3) !important;
}
body.twp-v2-portal #wrapper #main .discord-sec .join-disc-btn {
  margin-top: 10px;
  border-color: var(--pt-ivory) !important;
  background: var(--pt-ivory) !important;
  color: var(--pt-deep) !important;
}
body.twp-v2-portal #wrapper #main .discord-sec .join-disc-btn:hover {
  background: #fff !important;
}

/* ── Targets: compact links get a 32 px hit area (WCAG 2.5.8) ───────────────────────────────── */

body.twp-v2-portal #wrapper #main :is(
  .avada-myaccount-user a,
  .woocommerce-orders-table__cell-order-number a,
  .subscription-id a,
  .woocommerce-Address-title a.edit,
  header.title a.edit,
  .fusion-read-more,
  .product-buttons a,
  .fusion-product-buttons a,
  .show_details_button,
  .wlm3-form a,
  .wlm_inpageloginform a,
  .affwp-form a,
  .lost_password a,
  .woocommerce-LostPassword a,
  .fusion-meta-info a,
  .fusion-widget-area .widget a,
  #sidebar .widget a
) {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  min-height: 32px;
}

/* ── The page's entrance (login-page.css § Motion: once at load, opacity and a few px; no blur, no scale) ── */

@media (prefers-reduced-motion: no-preference) {
  body.twp-v2-portal .twp-frame-head::before,
  body.twp-v2-portal .twp-cell--head::after {
    transform-origin: left center;
    animation: twp-draw-x 0.9s var(--pt-ease-io) both;
  }
  body.twp-v2-portal .twp-head .twp-eyebrow {
    animation: twp-uncover 0.7s var(--pt-ease) 0.12s both;
  }
  body.twp-v2-portal .twp-head .twp-h1 {
    animation: twp-rise 0.8s var(--pt-ease) 0.2s both;
  }
  body.twp-v2-portal .twp-head :is(.twp-lead, .twp-facts) {
    animation: twp-rise 0.8s var(--pt-ease) 0.32s both;
  }
  body.twp-v2-portal #wrapper #main .twp-route {
    animation: twp-rise-sm 0.6s var(--pt-ease) both;
  }
  body.twp-v2-portal #wrapper #main .twp-route:nth-child(1) { animation-delay: 0.42s; }
  body.twp-v2-portal #wrapper #main .twp-route:nth-child(2) { animation-delay: 0.5s; }
  body.twp-v2-portal #wrapper #main .twp-route:nth-child(3) { animation-delay: 0.58s; }
  body.twp-v2-portal #wrapper #main .twp-route:nth-child(4) { animation-delay: 0.66s; }
}
@keyframes twp-rise {
  from {
    opacity: 0;
    translate: 0 8px;
  }
}
@keyframes twp-rise-sm {
  from {
    opacity: 0;
    translate: 0 4px;
  }
}
@keyframes twp-draw-x {
  from {
    transform: scaleX(0);
  }
}
@keyframes twp-uncover {
  from {
    clip-path: inset(-0.25em 100% -0.25em -0.25em);
  }
  to {
    clip-path: inset(-0.25em -0.25em -0.25em -0.25em);
  }
}

/* ── Right to left (Arabic): logical properties do most of it; arrows point the reading way ──── */

html[dir="rtl"] body.twp-v2-portal :is(.twp-h1, .twp-eyebrow, .twp-route-q, .twp-route-link, .twp-lead) {
  unicode-bidi: plaintext;
}
html[dir="rtl"] body.twp-v2-portal #wrapper #main :is(.twp-route-arrow, .twp-go) {
  transform: scaleX(-1);
}
html[dir="rtl"] body.twp-v2-portal #wrapper #main :is(
  form.woocommerce-form-login button[type="submit"],
  form.woocommerce-ResetPassword button[type="submit"],
  form.woocommerce-EditAccountForm button[type="submit"],
  .woocommerce-MyAccount-content form button[name="save_address"],
  form[id="add_payment_method"] [id="place_order"],
  .wlm3-form input[type="submit"],
  .wlm_inpageloginform input[type="submit"],
  form.affwp-form input[type="submit"],
  form.wpcf7-form input.wpcf7-submit,
  .twp-btn--go
) {
  padding: 0 calc(var(--pt-cta-h) * 0.42) 0 calc((var(--pt-cta-h) - var(--pt-cta-go)) / 2 + var(--pt-cta-go) + 14px) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='20' fill='%230b1120'/%3E%3Cpath d='M26.5 20H14M19 15.5 14.5 20 19 24.5' fill='none' stroke='%23eef1f7' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-position: left calc((var(--pt-cta-h) - var(--pt-cta-go)) / 2) center !important;
}
html[dir="rtl"] body.twp-v2-portal #wrapper #main select {
  background-position: left 14px center !important;
}

/* ── Motion: only what a state needs; nothing under reduced motion ────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  body.twp-v2-portal *,
  body.twp-v2-portal *::before,
  body.twp-v2-portal *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}

/* ── Print: the content, without the ground ───────────────────────────────────────────────── */

@media print {
  body.twp-v2-portal {
    background: #fff !important;
    color: #000;
  }
  body.twp-v2-portal :is(.woocommerce-MyAccount-navigation, .twp-sheet) {
    display: none !important;
  }
  body.twp-v2-portal #wrapper #main *,
  body.twp-v2-portal .twp-head * {
    color: #000 !important;
    background: none !important;
    box-shadow: none !important;
  }
}