/* rv_theme.css -- storefront counterpart of vertex/view/stylesheet/rv_admin_theme.css
 * (the "RV Theme" -- Russell, 2026-09-03, ticket 2026-08-31_23-19-41_Russell: "our
 * default bugboard retheme"). Same tokens, same primitive names (.card/.btn/.field/
 * .rowmsg/.pill), so a page that has seen one has seen both.
 *
 * WHY A SEPARATE FILE INSTEAD OF LINKING THE ADMIN ONE: vertex/ is IP-gated to staff
 * (vertex/.htaccess -- see docs/admin-ip-gate.md), and that gate applies to every
 * path under vertex/, static assets included. A customer's browser hitting
 * vertex/view/stylesheet/rv_admin_theme.css would 302 to the admin login page instead
 * of getting CSS. This file lives under catalog/, which is public, on purpose.
 * Keep the token values in sync with rv_admin_theme.css by hand if that palette ever
 * changes -- there is no build step here to share them automatically.
 */
.rvtheme, .rvtheme * { box-sizing: border-box; }

.rvtheme {
  --bg:#0b1220; --bg2:#0f1729; --panel:rgba(30,41,59,.55);
  --line:rgba(148,163,184,.16); --line2:rgba(148,163,184,.28);
  --txt:#e7ecf3; --muted:#93a4bd; --faint:#64748b;
  --accent:#6366f1; --accent2:#22d3ee;
  --accent-ink:#5457dd; --accent-ink2:#7539e0;
  --good:#34d399; --warn:#fbbf24; --bad:#f87171;
  --radius:14px;

  margin:0; font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--txt);
  background:
    radial-gradient(1100px 600px at 12% -10%, rgba(99,102,241,.18), transparent 60%),
    radial-gradient(900px 500px at 100% 0%, rgba(34,211,238,.12), transparent 55%),
    linear-gradient(180deg,var(--bg),var(--bg2));
  background-color:var(--bg); /* opaque base UNDER the gradients -- must follow the shorthand above */
  -webkit-font-smoothing:antialiased;
  padding:18px; border-radius:var(--radius);
}
.rvtheme a { color:var(--accent2); text-decoration:none; }
.rvtheme a:hover { text-decoration:underline; }
.rvtheme h1, .rvtheme h3 { color:var(--txt); }
/* A <label> inside a heading (the cart's Quick Order title) is the heading's text: rv_site.css styles every bare label as a small uppercase block,
   which turned "Quick Order" into "QUICK ORDER" in a lighter weight on shell pages (2026-10-07). */
.rvtheme :is(h1,h2,h3,h4) label { display:inline; margin:0; color:inherit; font:inherit; letter-spacing:inherit; text-transform:none; }

/* ---- card ----------------------------------------------------------------- */
.rvtheme .card {
  position:relative;
  background:linear-gradient(180deg,rgba(30,41,59,.9),rgba(23,32,50,.9));
  background-color:#162034;
  border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-bottom:0;
}
.rvtheme .card > h3 {
  margin:0; font-size:15px; font-weight:700; color:var(--txt);
  padding:13px 16px; border-bottom:1px solid var(--line);
}
.rvtheme .card .cardbody { padding:16px; }

/* ---- buttons ---------------------------------------------------------------*/
.rvtheme .btn {
  cursor:pointer; border:1px solid var(--line); background:var(--panel); color:var(--txt);
  border-radius:10px; padding:10px 16px; font-size:13px; font-weight:600;
  display:inline-flex; gap:8px; align-items:center; text-decoration:none; font-family:inherit;
}
.rvtheme .btn.primary { background:linear-gradient(135deg,var(--accent-ink),var(--accent-ink2)); border-color:transparent; color:#fff; }
.rvtheme .btn.primary:hover { color:#fff; }

/* ---- fields (same element list as rv_admin_theme.css -- element rules in the
   2013 storefront stylesheet.css would otherwise win over an inherited color) -- */
.rvtheme td, .rvtheme th, .rvtheme input, .rvtheme select, .rvtheme textarea { color:var(--txt); }
.rvtheme .field { margin-bottom:14px; }
.rvtheme .field > label {
  display:block; font-size:12px; font-weight:700; letter-spacing:.3px; text-transform:uppercase;
  color:var(--muted); margin-bottom:6px;
}
/* type=button / type=reset are BUTTONS, not fields. Without excluding them an
   <input type="button" class="btn"> picks up the full-width text-field styling
   here, and because :not() arguments carry specificity this selector (0,4,1)
   also outranks .rvtheme .btn.primary (0,3,0) -- so such a button rendered
   full-width and lost its primary color. type=submit was already excluded for
   the same reason. Ticket 2026-09-03_15-25-01_Claude. */
.rvtheme input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=reset]),
.rvtheme select, .rvtheme textarea {
  background:#0a1020; border:1px solid var(--line); border-radius:10px; padding:11px;
  color:var(--txt); font:13px/1.5 inherit; outline:0; max-width:100%; width:100%;
}
/* `font:13px/1.5 inherit` above is not valid CSS (inherit cannot be part of the shorthand), so browsers drop that whole declaration and every field keeps the
   browser's own font. Inputs and selects default to the system sans, which is why nobody saw it; a TEXTAREA defaults to MONOSPACE (the repair page's message box,
   2026-10-03). Fixing the shorthand itself would also change every field's line height (~4px taller on every re-themed page), so only the family is set here. */
.rvtheme textarea { font-family:inherit; }
.rvtheme input::placeholder { color:var(--faint); opacity:1; }
.rvtheme input:focus { border-color:var(--accent); }
.rvtheme .error { display:block; font-size:11.5px; color:#fca5a5; margin-top:5px; }
.rvtheme .required { color:#fca5a5; }

/* ---- messages ----------------------------------------------------------- */
.rvtheme .rowmsg {
  display:block; padding:10px 13px; border-radius:10px; margin:0 0 14px; font-size:12.5px; font-weight:600;
  background:var(--panel); border:1px solid var(--line); color:var(--muted);
}
.rvtheme .rowmsg.ok { background:rgba(16,185,129,.10); border-color:rgba(16,185,129,.35); color:#a7f3d0; }
.rvtheme .rowmsg.no { background:rgba(248,113,113,.10); border-color:rgba(248,113,113,.35); color:#fca5a5; }

/* ---- table ---------------------------------------------------------------- */
.rvtheme .tw { overflow-x:auto; }
.rvtheme table { border-collapse:collapse; width:100%; font-size:13px; background:transparent; color:var(--txt); }
.rvtheme table td { padding:9px 10px; border-bottom:1px solid var(--line); }
.rvtheme table tr:first-child td {
  font-size:11px; font-weight:700; letter-spacing:.4px; text-transform:uppercase;
  color:var(--muted); background:rgba(2,6,18,.35); border-bottom:1px solid var(--line2);
}

/* ---- progress stepper (order-status popup) --------------------------------
   Replaces the old images/steps/step[1-4].png set: four static raster images
   that were visually IDENTICAL regardless of which one was picked (the "which
   step is highlighted" idea was never actually wired into the artwork), and
   had no 5th frame for delivered even though step5.png existed, unreferenced,
   since 2015. This draws the real state instead of picking a fixed picture. */
.rvtheme .rvstepper { display:flex; align-items:flex-start; gap:0; margin:14px 0 4px; }
.rvtheme .rvstep { flex:1; text-align:center; position:relative; }
.rvtheme .rvstep::before {
  content:''; position:absolute; top:13px; left:-50%; width:100%; height:2px;
  background:var(--line2); z-index:0;
}
.rvtheme .rvstep:first-child::before { display:none; }
.rvtheme .rvstep.done::before { background:var(--good); }
.rvtheme .rvstep .dot {
  position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:center;
  width:26px; height:26px; border-radius:50%; font-size:12px; font-weight:700;
  background:var(--panel); border:2px solid var(--line2); color:var(--muted);
}
.rvtheme .rvstep.done .dot { background:var(--good); border-color:var(--good); color:#06281d; }
.rvtheme .rvstep.current .dot { border-color:var(--accent2); color:var(--txt); }
.rvtheme .rvstep .label {
  display:block; margin-top:6px; font-size:10.5px; font-weight:600; letter-spacing:.2px;
  color:var(--muted);
}
.rvtheme .rvstep.done .label, .rvtheme .rvstep.current .label { color:var(--txt); }

/* ---- address confirmation popup -------------------------------------------
   "Is your address correct?" — shown before an address is locked in, from seven
   templates (checkout guest/register/payment_address/shipping_address/
   guest_shipping, account address_form/register). Each has its own container id
   and its own onclick handlers, so they share this one rule set rather than
   seven copies of the styling.

   Russell, 2026-09-03: "we have a retheme like the bugboard..why the fuck are
   you not using it?" — so it uses the RV Theme primitives (.card/.cardbody/.btn)
   like every other retheme, instead of a one-off palette.

   Ticket 2026-09-03_15-25-01_Claude. */
.rvtheme.addrpop { max-width:460px; }
.rvtheme .addr {
  display:block; padding:15px 16px; border-radius:10px;
  background:rgba(2,6,18,.35); border:1px solid var(--line);
  color:var(--txt); font-size:14px; line-height:1.7; text-align:center;
}
/* the markup opens with a stray <br>, which would print a blank first line */
.rvtheme .addr > br:first-child { display:none; }
.rvtheme .addrbtns { margin-top:16px; text-align:center; }
.rvtheme .addrbtns .btn {
  width:auto; min-width:112px; justify-content:center; margin:0 5px;
  /* these are <input>, not <button>: inline-flex centring needs the explicit height */
  line-height:1.2;
}
.rvtheme .addrbtns .btn:focus { outline:2px solid var(--accent2); outline-offset:2px; }
@media (max-width:480px) {
  .rvtheme .addrbtns .btn { display:block; width:100%; margin:10px 0 0; }
}

/* ---- FAQ page (information/faq) --------------------------------------------
   Ticket 2026-09-04_23-59-18_Russell. The page was 6 collapsed gray bars driven
   by a jQuery slideToggle; it is now native <details>/<summary>, so it opens
   without JS, is keyboard-operable and screen-reader-announced for free.
   Tokens only -- no new hex values. */
.rvtheme .faqwrap { max-width:100%; }
.rvtheme .faqtools { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:16px; }
.rvtheme .faqsearch { flex:1 1 260px; min-width:0; }
.rvtheme .faqcount { font-size:12px; color:var(--muted); white-space:nowrap; }

/* category jump chips */
.rvtheme .faqjump { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 18px; padding:0; list-style:none; }
.rvtheme .faqjump a {
  display:inline-block; padding:6px 12px; border-radius:999px; font-size:12px; font-weight:600;
  background:var(--panel); border:1px solid var(--line); color:var(--muted); text-decoration:none;
}
.rvtheme .faqjump a:hover { color:var(--txt); border-color:var(--line2); text-decoration:none; }

.rvtheme .faqcat { margin-bottom:22px; scroll-margin-top:16px; }
.rvtheme .faqcat > h3 { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.rvtheme .faqcat > h3 .n { font-size:11px; font-weight:700; color:var(--muted); letter-spacing:.4px; }

/* one Q&A */
.rvtheme details.qa { border-bottom:1px solid var(--line); }
.rvtheme details.qa:last-child { border-bottom:0; }
.rvtheme details.qa > summary {
  list-style:none; cursor:pointer; padding:14px 16px 14px 40px; position:relative;
  font-size:14px; font-weight:600; color:var(--txt);
}
.rvtheme details.qa > summary::-webkit-details-marker { display:none; }
.rvtheme details.qa > summary:hover { background:rgba(2,6,18,.25); }
.rvtheme details.qa > summary:focus-visible { outline:2px solid var(--accent2); outline-offset:-2px; }
/* chevron */
.rvtheme details.qa > summary::before {
  content:''; position:absolute; left:16px; top:19px;
  width:7px; height:7px; border-right:2px solid var(--accent2); border-bottom:2px solid var(--accent2);
  transform:rotate(-45deg); transition:transform .15s ease;
}
.rvtheme details.qa[open] > summary::before { transform:rotate(45deg); top:17px; }
.rvtheme details.qa[open] > summary { color:var(--accent2); }

.rvtheme .qabody { padding:0 16px 16px 40px; font-size:13.5px; line-height:1.7; color:var(--txt); }
.rvtheme .qabody p { margin:0 0 10px; }
.rvtheme .qabody p:last-child { margin-bottom:0; }
.rvtheme .qabody ul { margin:0 0 10px; padding-left:20px; }
.rvtheme .qabody li { margin:3px 0; }
.rvtheme .qabody strong { color:var(--txt); }
.rvtheme .qabody a { color:var(--accent2); text-decoration:underline; }

/* "nothing matched your search" */
.rvtheme .faqnone { display:none; }
.rvtheme .faqwrap.searching .faqnone.show { display:block; }

/* help footer */
.rvtheme .faqhelp { margin-top:20px; }
.rvtheme .faqhelp .cardbody { display:flex; gap:14px; flex-wrap:wrap; align-items:center; justify-content:space-between; }
.rvtheme .faqhelp p { margin:0; font-size:13.5px; color:var(--muted); }
.rvtheme .faqhelp .btns { display:flex; gap:10px; flex-wrap:wrap; }

@media (max-width:600px) {
  .rvtheme details.qa > summary { padding-left:34px; font-size:13.5px; }
  .rvtheme .qabody { padding-left:34px; }
  .rvtheme .faqhelp .cardbody { flex-direction:column; align-items:flex-start; }
}

/* ======================================================================
   CHECKOUT STEP 1 -- the Guest / Sign In / Register chooser.
   Added 2026-09-11, ticket 2026-09-08_00-24-12_Russell.
   ====================================================================== */

/* Each option is a whole clickable card rather than a bare radio + text, so the
   hit target is the full row instead of a 13px circle -- this is the first
   thing anyone does at checkout and it is frequently done on a phone. */
.rvtheme .choices { display:grid; gap:10px; margin-bottom:16px; }
.rvtheme .choice {
  display:flex; align-items:flex-start; gap:11px; margin:0; cursor:pointer;
  padding:13px 15px; border:1px solid var(--line2); border-radius:12px;
  background:var(--panel); transition:border-color .15s, background .15s;
}
/* On a page on the home page's shell, rv_site.css has a bare `label { text-transform:uppercase; letter-spacing:.01em }` (the home page's own forms), and a choice
   card IS a <label>: every option and its small description came out in capitals (repair page, 2026-10-03; the checkout's choice cards too). */
.rvtheme .choice { text-transform:none; letter-spacing:normal; }
.rvtheme .choice:hover { border-color:var(--accent); }
.rvtheme .choice input[type=radio] { margin:2px 0 0; cursor:pointer; accent-color:var(--accent); flex:none; }
.rvtheme .choice .ct { display:flex; flex-direction:column; gap:3px; min-width:0; }
.rvtheme .choice .ct b { font-size:14px; font-weight:700; color:var(--txt); }
.rvtheme .choice .ct small { font-size:12px; color:var(--muted); line-height:1.45; }
/* The selected card is called out with a ring AND a tinted fill -- not color
   alone, so it still reads if the ring is hard to see. */
.rvtheme .choice.on {
  border-color:var(--good); background:rgba(52,211,153,.10);
  box-shadow:0 0 0 1px var(--good) inset;
}   /* green = selected everywhere in checkout (Step 5's payment rows use the same); it was indigo here (Russell 2026-09-30) */
.rvtheme .choice input[type=radio]:checked { accent-color:var(--good); }
/* The checkout shell (checkout.tpl) carries an inline `#checkout input:focus, select:focus, textarea:focus { outline: blue 3px solid; box-shadow: blue glow }` for every field,
   which lands on a radio the moment it is CLICKED and on every themed field as a blue frame. It has an ID, so it needs an ID-qualified rule to answer it. Inside the themed
   steps: mouse focus adds no frame (the green selected stroke / the accent border is the feedback), keyboard focus (and any text field, which is always focus-visible) gets the
   theme's cyan ring. Order matters: the :focus rule first, the :focus-visible ring after it. */
#checkout .rvtheme input:focus, #checkout .rvtheme select:focus, #checkout .rvtheme textarea:focus { outline:none !important; box-shadow:none !important; }
#checkout .rvtheme input:focus-visible, #checkout .rvtheme select:focus-visible, #checkout .rvtheme textarea:focus-visible { outline:2px solid var(--accent2) !important; outline-offset:2px; }

/* Password field: the reveal eye sits inside the input, so it needs a
   positioned wrapper and right padding on the field itself -- otherwise a long
   password runs underneath the icon. */
.rvtheme .pwwrap { position:relative; display:block; }
/* width is !important ON PURPOSE. checkout.tpl carries an inline <style> with
   `#checkout input[type=text], #checkout input[type=password], ... { width:268px }`.
   That selector is (1,1,1) -- it has an ID -- so it outranks the theme's own input
   rule AND anything scoped to .rvtheme, and a password field inside checkout came
   out 268px wide while the e-mail field beside it ran full width (type=email is not
   in that list, so it escapes). The reveal icon is positioned against the WRAPPER,
   so the mismatch also stranded the eye far to the right of the box. */
.rvtheme .pwwrap input { width:100% !important; padding-right:38px; }
.rvtheme .pwwrap .showpass {
  position:absolute; top:50%; right:12px; transform:translateY(-50%);
  cursor:pointer; color:var(--muted); font-size:14px;
}
.rvtheme .pwwrap .showpass:hover { color:var(--txt); }
.rvtheme .field .forgot { display:inline-block; margin-top:7px; font-size:12px; color:var(--accent2); }

/* Inline validation message under a field. */
.rvtheme .field .err { display:block; margin-top:6px; font-size:12px; color:#fca5a5; }
/* Flagged field: red border. The theme's text-field rule above is (0,7,1) because of its :not() chain, so a plain `.rvtheme input.required-message` (0,2,1) NEVER applied -- flagged
   boxes kept the quiet gray border. Same :not() chain here + the class outranks it. A flagged field also stays red while it has focus (the cyan focus ring used to hide the flag the
   moment the box was focused -- sign-in puts the cursor back in the box it just flagged). 2026-09-30 */
.rvtheme input.required-message:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=reset]),
.rvtheme select.required-message, .rvtheme textarea.required-message { border-color:#f87171; }
#checkout .rvtheme input.required-message:focus-visible, .rvtheme input.required-message:focus-visible, .rvtheme input.required-message:focus,
.rvtheme select.required-message:focus-visible, .rvtheme textarea.required-message:focus-visible { outline:2px solid #f87171 !important; outline-offset:2px; border-color:#f87171; }

/* The Caps-Lock warning, which the old page built with eleven chained .css()
   calls in the keypress handler. */
.rvtheme #capsalert {
  display:inline-block; margin-top:7px; padding:5px 9px; border-radius:6px; cursor:pointer;
  background:rgba(245,158,11,.16); border:1px solid rgba(245,158,11,.45);
  color:#fde68a; font-size:12px; font-weight:700;
}


/* ======================================================================
   CUSTOMER SIGN-IN (account/login)
   Added 2026-09-17, ticket 2026-09-08_00-24-12_Russell.
   ====================================================================== */

/* Sign-in card beside the third-party card. Collapses to one column on a
   narrow screen -- this page gets a lot of phone traffic and the two cards
   side by side at 400px would squeeze the e-mail field to nothing. */
.rvtheme .logingrid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:start; }
@media (max-width:820px) { .rvtheme .logingrid { grid-template-columns:minmax(0,1fr); } }
.rvtheme .logingrid > .right { min-width:0; }

.rvtheme .loginbtns { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.rvtheme .loginbtns .btn { margin:0; }
/* input[type=submit] is excluded from the theme's text-field styling, but it still
   needs the button metrics since it is a submit rather than an <a class="btn">. */
.rvtheme .loginbtns input[type=submit] { width:auto; cursor:pointer; }

/* The Third Party Connections card (module/social_login) when it renders INSIDE a
   themed page -- currently account/login's right column. The module paints itself
   white with INLINE styles (`background:#fff` on #rvSocialLoginWrap, `color:#222`
   and `#666` on its two text lines), which is why these need !important: an inline
   declaration outranks any normal stylesheet rule.
   Scoped under .rvtheme ON PURPOSE -- the same module renders on pages that have
   not been converted, and those must keep the light card. The provider tiles are
   deliberately left alone: those are brand marks, not chrome. */
.rvtheme #rvSocialLoginWrap {
  background:var(--panel) !important;
  border-color:var(--line2) !important;
  border-radius:14px !important;
  max-width:none !important;
  margin:0 !important;
}
.rvtheme #rvSocialLoginWrap > div:first-child { color:var(--txt) !important; }
.rvtheme #rvSocialLoginWrap > div:nth-child(2) { color:var(--muted) !important; }
.rvtheme #rvSocialLoginWrap .rv-sl-cap { color:var(--muted); }

/* ======================================================================
   CART STAFF LINK POPUPS (checkout/cart_ajax: Copy Link / E-Mail Link)
   Added 2026-09-23, ticket 2026-09-08_00-24-12_Russell.
   ====================================================================== */
.rvtheme.linkpop { max-width:640px; margin:0 auto; }
.rvtheme.linkpop .card { margin-bottom:0; }

/* Amber "read this" banner -- the reset-session warning. Not red: red reads as
   "something failed", and this is a reminder shown before anything has. */
.rvtheme .rowmsg.warn { background:rgba(245,158,11,.12); border-color:rgba(245,158,11,.4); color:#fde68a; font-weight:500; line-height:1.55; }
.rvtheme .rowmsg.warn b { color:#fbbf24; }

/* The link itself, as a readable field-like block that wraps instead of running
   off the card (a cart URL is ~120 chars with the id). */
/* The link itself, as a readable field-like block that wraps instead of running off
   the card (a cart URL is ~120 chars with the id).
   !important on the four properties below is REQUIRED: common.js runcopyclipboard()
   restyles every .copyclipboard link with INLINE css -- `background-color:#e7e7e7;
   padding:5px;line-height:25px;white-space:nowrap` -- and wraps its text in a <span>
   with a dark clone icon after it. An inline style beats any normal rule, and nowrap
   is what would push a long URL out of the card. */
.rvtheme a.linkbox {
  display:block; padding:10px 12px !important; border-radius:10px; background-color:#0a1020 !important;
  border:1px solid var(--line); color:var(--accent2); line-height:1.5 !important; white-space:normal !important;
  font:12.5px/1.5 ui-monospace,Menlo,Consolas,monospace; word-break:break-all; text-decoration:none;
}
.rvtheme a.linkbox:hover { border-color:var(--accent); }
.rvtheme a.linkbox img { filter:invert(1) brightness(1.4); vertical-align:middle; margin-left:4px; }
.rvtheme .field .hint { display:block; margin-top:8px; font-size:12px; line-height:1.5; color:var(--muted); }

/* Magnific wraps every inline popup in a white .mfp-content box with 20px padding (site
   rule), which left the dark card floating inside a white frame. Drop that frame for the
   two staff link popups only -- :has() keeps it scoped to a .mfp-content that actually
   contains one, so every other popup on the site keeps its white box. */
.mfp-content:has(> .linkpop) { background:transparent !important; padding:0 !important;
  max-width:640px !important; /* the inline script pins .mfp-content to 700px, which pushed the close X 60px past the panel edge */ }
.rvtheme.linkpop { border-radius:16px; }

/* RE-THEME RULE -- quantity fields (Russell, ticket 2026-09-08_00-24-12_Russell, 2026-09-29):
   every quantity on a re-themed page is <input type="number" class="rv-qty" min="1" step="1">, an
   up/down arrow field. Never a 1..9 + "10+" dropdown, never a bare text box. Behavior (settle delay,
   twin fields, Enter/blur) lives in catalog/view/javascript/rv_qty.js; docs/retheme-rules.md has the
   markup, and lib/rv_retheme_rules_selftest.php fails the test run if a re-themed template breaks it.
   !important because the base .rvtheme input rule above out-ranks any short selector. Firefox only
   draws the arrows on hover/focus (no CSS can force them); Chrome, Edge and Safari show them always. */
.rvtheme input.rv-qty { width:78px !important; max-width:100%; padding:6px 4px 6px 10px !important; text-align:center;
  color-scheme:dark; -moz-appearance:number-input; appearance:auto; }
.rvtheme input.rv-qty::-webkit-inner-spin-button,
.rvtheme input.rv-qty::-webkit-outer-spin-button { opacity:1; height:24px; margin-left:4px; cursor:pointer; }

/* RE-THEME RULE -- field states (Russell 2026-09-29, docs/retheme-rules.md rule 3). Neutral until judged; green = checked and
   good (rv-ok), red = a flag or issue (rv-bad) with the reason under the field (.rv-fieldmsg); the search-as-you-type cue is a
   magnifier (rv-searchfield), never a color. Set by catalog/view/javascript/rv_fieldcheck.js from the server's own rules
   (checkout/field_check). The state icon takes the right-hand slot; selects keep their own arrow and only change border.
   !important because the base .rvtheme input rule above out-ranks any short selector. */
.rvtheme input.rv-searchfield { background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2322d3ee' stroke-width='2.4' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='M20 20l-3.5-3.5'/></svg>") !important;
  background-repeat:no-repeat !important; background-position:right 10px center !important; background-size:16px !important; padding-right:34px !important; }
.rvtheme input.rv-ok, .rvtheme select.rv-ok { border-color:var(--good) !important; box-shadow:0 0 0 1px rgba(16,185,129,.35); }
.rvtheme input.rv-ok { background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2334d399' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12.5l4.5 4.5L19 7.5'/></svg>") !important;
  background-repeat:no-repeat !important; background-position:right 10px center !important; background-size:16px !important; padding-right:34px !important; }
.rvtheme input.rv-bad, .rvtheme select.rv-bad { border-color:var(--bad) !important; box-shadow:0 0 0 1px rgba(248,113,113,.35); }
.rvtheme input.rv-bad { background-color:rgba(248,113,113,.10) !important; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23f87171' stroke-width='3' stroke-linecap='round'><path d='M12 5v9'/><circle cx='12' cy='19' r='.6'/></svg>") !important;
  background-repeat:no-repeat !important; background-position:right 10px center !important; background-size:16px !important; padding-right:34px !important; }
.rvtheme .rv-fieldmsg { display:block; margin:5px 0 0; font-size:12px; line-height:1.4; color:#fca5a5; }

/* RE-THEME: price-source badges (staff cart list, Step 6). Russell 2026-09-29: the R / O / C letters were text with a background color, so their
   boxes came out different heights and misaligned (cart page, then Step 6); "turn them into true badges". A badge is a fixed 22px rounded square
   with its letter centered, in a two-column row with the amount beside it, so every row lines up the same way wherever it is used.
   Legend colors are the ones staff already know (Regular blue, Online red, Cost green, Wholesale/Cost-override dark green, Group purple). White
   letters fail contrast on the bright green and purple (2.8:1, 3.4:1), so those two take dark ink instead (~5:1). */
.rvtheme .rv-prow { display:grid; grid-template-columns:22px auto; align-items:center; gap:6px; justify-content:start; margin:3px 0; padding:0 8px; }
/* "> .rv-pbadge" (3 classes) so a legacy grid's blanket "span" rules (.item-cont span: float, 58px min-height, padding, left border) cannot reshape the badge. */
.rvtheme .rv-prow > .rv-pbadge { display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; width:22px; height:22px; min-height:0;
  float:none; padding:0; border:0; border-radius:6px; font-size:12px; font-weight:800; line-height:1; text-align:center; color:#fff; }
.rvtheme .rv-prow > .rv-pb-r { background:#0000d9; }
.rvtheme .rv-prow > .rv-pb-o { background:#d90000; }
.rvtheme .rv-prow > .rv-pb-c { background:#00b300; color:#06281d; }
.rvtheme .rv-prow > .rv-pb-l, .rvtheme .rv-prow > .rv-pb-v { background:#008000; }
.rvtheme .rv-prow > .rv-pb-g { background:#d24cff; color:#06281d; }
.rvtheme .rv-prow > a { color:var(--accent2); text-decoration:none; font-size:13px; line-height:1.3; padding:2px 4px; border-radius:4px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.rvtheme .rv-prow > a:hover { background:var(--panel); }

/* Native dropdown lists (Russell 2026-09-29: "what about all the dropdowns in the admin in this same area on the cart?"). The closed select was already
   themed, but its option list had a transparent background, so the popup fell back to the browser's white. Explicit colors so it opens dark too. */
.rvtheme select option, .rvtheme select optgroup { background-color:#0a1020; color:var(--txt); }
.rvtheme select option:disabled { color:var(--faint); }

/* Keyboard focus ring on themed pages. The accessibility pass (2026-09-27, stylesheet_global.css) gives every focused-by-keyboard control a 3px blue outline plus a
   white 5px halo, which reads as a bright white frame on the dark theme (seen on the cart's search box). Same idea, in the theme's own colors: a clear 2px
   cyan ring with a small gap, no halo. Still unmistakable for a keyboard user. Scoped to .rvtheme, so every other page keeps the site-wide ring. */
.rvtheme a:focus-visible, .rvtheme button:focus-visible, .rvtheme input:focus-visible, .rvtheme select:focus-visible,
.rvtheme textarea:focus-visible, .rvtheme summary:focus-visible, .rvtheme [tabindex]:not([tabindex="-1"]):focus-visible {
  outline:2px solid var(--accent2) !important; outline-offset:2px; box-shadow:none; }   /* !important: the theme's own input rule above sets outline:0 with higher specificity */

/* ======================================================================
   THIRD-PARTY SIGN-IN, PLAIN (Russell 2026-09-30): the four provider circles, left-justified, with three short lines that say what a third-party sign-in does.
   Used by checkout Step 1 (checkout/login_next.tpl) and the account login page (account/login.tpl): put class rv-social-plain on the container.
   module/social_login.tpl paints its own light card with INLINE styles and carries its own heading + sentence; inside .rv-social-plain the box, heading and sentence are
   hidden (the tiles and their behavior are untouched) and the copy below replaces them. The behavior in the three lines is the real one (lib/rv_social_login.php):
   the provider's e-mail is matched to the account's MAIN e-mail; a match signs into that account; no match creates a new one.
   ====================================================================== */
.rvtheme .rv-social-plain .rv-or { display:flex; align-items:center; gap:12px; margin:18px 0 14px; font-size:16px; font-weight:600; color:var(--good); }
.rvtheme .rv-social-plain .rv-or:after { content:""; flex:1; height:1px; background:rgba(52,211,153,.35); }
.rvtheme .rv-social-plain #rvSocialLoginWrap { background:transparent !important; border:0 !important; padding:0 !important; margin:0 !important; max-width:none !important; }
.rvtheme .rv-social-plain #rvSocialLoginWrap > div:first-child, .rvtheme .rv-social-plain #rvSocialLoginWrap > div:nth-child(2) { display:none !important; }
.rvtheme .rv-social-plain #rvSocialLoginWrap .rv-sl-row { justify-content:flex-start; gap:10px; margin-left:-11px; }   /* -11px: the FIRST circle's edge lines up with the text around it (tiles 62px, circles 40px) */
.rvtheme .rv-social-plain #rvSocialLoginWrap .rv-sl-btn:hover, .rvtheme .rv-social-plain #rvSocialLoginWrap .rv-sl-btn:focus-visible { box-shadow:0 0 0 2px var(--good); }
/* the status line: the module sets #555 (progress) or #b3261e (error) INLINE, both unreadable on dark; the browser stores them as rgb(...) so the attribute selectors match */
.rvtheme .rv-social-plain #rvSocialLoginMsg { margin-top:12px !important; font-size:13px !important; line-height:1.45; text-align:left; color:var(--txt) !important; }
.rvtheme .rv-social-plain #rvSocialLoginMsg[style*="179, 38, 30"], .rvtheme .rv-social-plain #rvSocialLoginMsg[style*="b3261e"] { color:var(--bad) !important; }
.rvtheme .rv-social-plain #rvSocialLoginMsg:empty { display:none; }
.rvtheme .rv-social-plain .rv-sl-notes { list-style:none; margin:16px 0 0; padding:0; display:grid; gap:7px; }
.rvtheme .rv-social-plain .rv-sl-notes li { display:flex; align-items:baseline; gap:9px; font-size:13px; line-height:1.4; color:var(--muted); }
.rvtheme .rv-social-plain .rv-sl-notes li i, .rvtheme .rv-social-plain .rv-sl-notes li svg { flex:none; width:16px; text-align:center; color:var(--accent2); }
.rvtheme .rv-social-plain .rv-sl-notes b { color:var(--txt); font-weight:700; }

/* ======================================================================
   THIRD-PARTY SIGN-IN, REWRITTEN (re-theme rule 23, 2026-10-07, ticket 2026-10-03_14-52-21_Russell; preview key 'Social Login', canary only until promoted):
   module/social_login_next.tpl + rv_social_login.js. Written for the dark theme from the start: no inline styles, no !important, nothing to paint over.
   Same measurements as the plain look above (40px circles in 62px tiles, the first circle's edge on the text line, green ring on hover / keyboard focus).
   At promotion the #rvSocialLoginWrap and .rv-social-plain #rvSocialLogin* overrides above go away with module/social_login.tpl (rule 20).
   ====================================================================== */
.rvtheme .rv-sl .rv-sl-row { display:flex; align-items:flex-start; gap:10px; flex-wrap:nowrap; margin-left:-11px; }
.rvtheme .rv-sl .rv-sl-tile { width:62px; flex:0 0 62px; text-align:center; }
.rvtheme .rv-sl .rv-sl-btn { width:40px; height:40px; box-sizing:border-box; border-radius:50%; border:1px solid #ddd; display:flex; align-items:center; justify-content:center;
  margin:0 auto 7px; cursor:pointer; overflow:hidden; line-height:0; }
.rvtheme .rv-sl .rv-sl-btn:hover, .rvtheme .rv-sl .rv-sl-btn:focus-visible { box-shadow:0 0 0 2px var(--good); outline:0; }
.rvtheme .rv-sl .rv-sl-amazon { background:#f0c14b; border-color:#d9a63f; }
.rvtheme .rv-sl .rv-sl-google { border:0; background:none; }   /* Google's SDK draws its own circle in here */
.rvtheme .rv-sl .rv-sl-microsoft { background:#fff; }
.rvtheme .rv-sl .rv-sl-apple { background:#000; border-color:#000; }
.rvtheme .rv-sl .rv-sl-cap { display:block; font-size:12px; line-height:14px; color:var(--muted); }
.rvtheme .rv-sl .rv-sl-msg { margin:12px 0 0; font-size:13px; line-height:1.45; color:var(--txt); }
.rvtheme .rv-sl .rv-sl-msg.is-err { color:var(--bad); }
.rvtheme .rv-sl .rv-sl-msg[hidden] { display:none; }

/* Step 3 (address) on a phone: the old sheets leave these fields at 32px and the Continue button at 30px, which is a small touch
   target and smaller than Step 2's 39px fields. Phone widths only; desktop keeps its approved size. min-height, not height, so the
   shell's ID-qualified fixed sizes cannot win. */
@media (max-width:480px){
  #contenti .rvtheme.rv-step3 input[type=text],#contenti .rvtheme.rv-step3 input[type=tel],#contenti .rvtheme.rv-step3 input[type=email],
  #contenti .rvtheme.rv-step3 select,#contenti .rvtheme.rv-step3 .button,#contenti .rvtheme.rv-step3 input[type=button],
  #contenti .rvtheme.rv-step3 input[type=submit]{min-height:40px}
}

/* NOTE: Steps 2-6 live in #contenti; #checkout wraps ONLY Step 1, so these must start with #contenti. */
/* Step 2 + Step 3: the address messages the scripts build (.success / .attention / .warning spans with an inline
   display/width/font-size:12px), and Step 3's Continue row. Class names are JS hooks so they are restyled, not renamed.
   The #checkout ID beats the older per-template rules; !important is only for the properties the scripts set inline. */
#contenti .rvtheme.rv-step2 .success,
#contenti .rvtheme.rv-step2 .attention:not(.rowmsg),
#contenti .rvtheme.rv-step2 .warning:not(.rowmsg),
#contenti .rvtheme.rv-step3 .success,
#contenti .rvtheme.rv-step3 .attention:not(.rowmsg),
#contenti .rvtheme.rv-step3 .warning:not(.rowmsg){
  display:block !important;width:auto !important;font-size:14px !important;line-height:1.6;font-weight:500;
  padding:12px 16px;margin:0 0 14px;border-radius:10px;border:1px solid var(--line)}
#contenti .rvtheme.rv-step3 .success{background:rgba(16,185,129,.10);border-color:rgba(16,185,129,.35);color:#a7f3d0;border-left:3px solid var(--good)}
#contenti .rvtheme.rv-step3 .attention:not(.rowmsg){background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.4);color:#fde68a;border-left:3px solid var(--warn)}
#contenti .rvtheme.rv-step3 .warning:not(.rowmsg){background:rgba(248,113,113,.10);border-color:rgba(248,113,113,.35);color:#fca5a5;border-left:3px solid var(--bad)}
/* rvAddrMsg() hard-codes <b style="background-color:yellow">: dark text, and room around the text so the highlight does not hug the words */
#contenti .rvtheme.rv-step2 .success b[style*="yellow"],
#contenti .rvtheme.rv-step3 .success b[style*="yellow"]{color:var(--bg);padding:2px .7em;margin:0 2px;border-radius:4px;
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
/* Step 3 Continue / Reset row: the global .buttons is a white box with a gray border */
#contenti .rvtheme.rv-step3 .buttons{background:transparent;border:0;padding:0 2px;margin:0 0 14px;overflow:visible}
#contenti .rvtheme.rv-step3 .buttons .left,
#contenti .rvtheme.rv-step3 .buttons .right{float:none;width:auto;margin:0;display:flex;flex-wrap:wrap;gap:10px;align-items:center}

/* Signed-in Step 2 (payment_address_next): same white .buttons strip as Step 3 had. Guest Step 2 already has its own #button-guest-box rule. */
#contenti .rvtheme.rv-step2 .buttons{background:transparent;border:0;padding:0 2px;margin:0 0 14px;display:flow-root}
/* Step 3: the old global `#content .content{border:1px solid #EEE}` draws a thin white frame around the form on the dark card (Step 2 already removes it). */
#contenti .rvtheme.rv-step3 .cardbody > .content{border:0}

/* Re-themed checkout on a PHONE: the site chat pill defaults to the LEFT edge (site-wide choice, to dodge the home-page cart sidebar), which on checkout is
   exactly where Continue / Confirm Order / the decline messages sit. Measured on a 390px phone: pill x 8-227 vs Confirm x 45-219, so the pill covers the
   button and takes its tap. Dock it on the right here. Phones only: on desktop the chat script positions the pill with inline styles, and moving only the
   panel would misplace it. #contenti is the checkout shell's step container, so this never touches the old pages. */
@media (max-width:768px) and (pointer:coarse){
  body:has(#contenti .rvtheme) #rv-site-chat-root,
  body:has(#contenti .rvtheme) #rv-offline-note{left:auto !important;right:8px !important}
  body:has(#contenti .rvtheme) #rv-site-chat-panel{left:auto !important;right:8px !important}
}

/* ---- Deep dive 2026-09-30: things only visible inside the real checkout shell (checkout.tpl). Scoped to the re-themed templates: their popups carry
   role="dialog" (the old customer templates' popups do not), and their steps carry an rv-stepN class, so the pages customers get today are untouched. ---- */
/* Address popups ("Is your address correct?"): Magnific wraps an inline popup in the site's white .mfp-content box with 20px padding = a white frame around the dark card. */
.mfp-content:has(> .rvtheme.addrpop[role="dialog"]) { background:transparent !important; padding:0 !important; }
/* Keyboard focus. checkout.tpl marks a focused button with a black + yellow ring and a zoom, and paints focused inputs pale yellow (built for the light pages).
   Same job in theme colors: a cyan ring with a soft halo, no zoom, no fill change. */
#checkout .rvtheme .button:focus, #checkout .rvtheme input[type="button"]:focus, #checkout .rvtheme a.button:focus,
#valadd.rvtheme[role="dialog"] .button:focus, #valadd.rvtheme[role="dialog"] input[type="button"]:focus,
#valaddship.rvtheme[role="dialog"] .button:focus, #valaddship.rvtheme[role="dialog"] input[type="button"]:focus,
.rvtheme .rv-pay #button-confirm:focus, .rvtheme .rv-pay .braintreeconfirm:focus {
  outline:3px solid var(--accent2) !important; outline-offset:2px !important; box-shadow:0 0 0 6px rgba(34,211,238,.22) !important; transform:none; }
#valadd.rvtheme[role="dialog"] input.btn:not(.primary):focus, #valaddship.rvtheme[role="dialog"] input.btn:not(.primary):focus { background-color:var(--bg2) !important; }
#checkout .rvtheme input[type="text"]:focus, #checkout .rvtheme input[type="email"]:focus, #checkout .rvtheme input[type="password"]:focus { background-color:var(--bg) !important; }
/* The shell prepends its error box (.warning) to the step's .checkout-content, OUTSIDE the themed card, so it kept the old pink look. It sits on the page's own
   light ground there, so it gets a solid dark panel. The values are the theme tokens written out, because the tokens are not defined outside .rvtheme. */
.checkout-content:has(> .rvtheme[class*="rv-step"]) > .warning { background:#0f1729 none; color:#fca5a5; border:1px solid rgba(248,113,113,.45); border-left:4px solid #f87171;
  border-radius:14px; padding:12px 16px; margin:0 0 12px; font-size:14px; line-height:1.5; }
.checkout-content:has(> .rvtheme[class*="rv-step"]) > .warning a { color:#22d3ee; }
/* Small touch targets on phones: Step 1's sign-in fields (32px) and Step 2's "Same Shipping and Billing Address" checkbox (13px). */
@media (max-width:480px){
  #checkout .rvtheme input[type="text"], #checkout .rvtheme input[type="email"], #checkout .rvtheme input[type="password"] { min-height:40px; }
}
.rvtheme.rv-step2 #button-guest-box input[type="checkbox"] { width:20px; height:20px; }

/* Checkout errors at the point of error (rv_fielderr.js, 2026-09-30): the shell's top banner is moved under the box or list it is about. */
.rvtheme .rv-steperr { display:block; margin:6px 0 0; font-size:12px; line-height:1.45; color:#fca5a5; }
.rvtheme .rv-steperr.rv-steperr-block { font-size:13px; margin:8px 0 12px; }
.rvtheme .rv-steperr a { color:var(--accent2); text-decoration:underline; }
.rvtheme .rv-steperr-on:not(input):not(select):not(textarea) { outline:2px solid #f87171; outline-offset:4px; border-radius:14px; }
/* Step 4 error box (shipping_method_next.tpl .warehouse_rush_box): the shell's inline red pill becomes the field-error look, and the list gets the red outline. */
.rvtheme .rv-ship-err .warehouseremove { height:auto !important; }
.rvtheme .rv-ship-err .warehouse_rush { float:none !important; display:block !important; background:transparent !important; border:0 !important; padding:0 !important;
  margin:8px 0 12px; color:#fca5a5 !important; font-size:13px; font-weight:600; }
.rvtheme .rv-ship-list:has(+ .rv-ship-err .warehouse_rush) { outline:2px solid #f87171; outline-offset:4px; border-radius:14px; }

/* ONE rule for the Visa mark on the dark theme (Russell 2026-10-01: "the VISA logo is two different colors ... if we make a change, it should update in all locations").
   The mark is #1434CB on transparent and vanishes on dark. It used to be lightened ONLY for Drop-in's own icons in Step 6, so Step 5's card tile, the pay link's card tile and
   the Step 6 list showed a different blue. This matches every <use> of #icon-visa inside a re-themed page, whichever file draws it (xlink:href or href), so a new page cannot miss it. */
.rvtheme svg:has(> use[*|href="#icon-visa"]) { filter:brightness(3) saturate(.6); }

/* ---- native dialogs (rv_dialog.js; the cart's dialogs, the checkout popups) -- the ONE base look (re-theme rule 20, 2026-10-02) ----
   Moved here from rv_cart.css so the checkout steps and the cart share it. */
dialog.rv-dialog { position:fixed; inset:0; width:min(92vw, 560px); margin:auto; padding:22px 22px 20px; border:1px solid var(--line2, #1e293b); border-radius:16px; background:var(--bg2, #0f172a); color:var(--txt, #e7ecf3); box-shadow:0 24px 60px rgba(0,0,0,.6); }
dialog.rv-dialog::backdrop { background:rgba(2,6,18,.7); }
/* a popup whose content is already a .card (the address confirm, the returning-customer sign-in): the card is the frame, 448px like the Magnific box it replaces */
dialog.rv-dialog.rv-dialog-card { width:min(92vw, 448px); padding:0; border:0; background:transparent; box-shadow:none; overflow:visible; }
/* a page or a picture in a popup (rv_dialog.js page() / image()): scrolls inside, closes on a background click */
dialog.rv-dialog.rv-dialog-wide { width:min(94vw, 760px); max-height:88vh; overflow:auto; padding:26px 26px 22px; }
dialog.rv-dialog.rv-dialog-frame { width:min(96vw, 720px); height:min(90vh, 880px); padding:0; overflow:hidden; }
dialog.rv-dialog.rv-dialog-frame .rv-dialog-iframe { display:block; width:100%; height:100%; border:0; background:var(--bg2, #0f172a); }
dialog.rv-dialog.rv-dialog-frame .rv-dialog-x { z-index:2; }
dialog.rv-dialog .rv-dialog-x { position:absolute; width:auto; min-width:0; margin:0; top:8px; right:10px; background:none; border:0; color:var(--muted); font-size:26px; line-height:1; cursor:pointer; padding:4px 8px; }
dialog.rv-dialog .rv-dialog-x:hover { color:var(--txt); }
dialog.rv-dialog .rv-dialog-body:focus { outline:none; }
dialog.rv-dialog .rv-dialog-page { line-height:1.55; font-size:14px; }
dialog.rv-dialog .rv-dialog-page h1 { margin:0 0 12px; font-size:22px; }
dialog.rv-dialog .rv-dialog-page h2, dialog.rv-dialog .rv-dialog-page h3 { margin:16px 0 6px; font-size:16px; }
dialog.rv-dialog .rv-dialog-page p { margin:0 0 10px; }
dialog.rv-dialog .rv-dialog-image { margin:0; text-align:center; }
dialog.rv-dialog .rv-dialog-image img { max-width:100%; max-height:74vh; border-radius:10px; }
dialog.rv-dialog .rv-dialog-image figcaption { margin-top:8px; color:var(--muted); font-size:13px; }


/* ---- RE-THEME RULE -- phone fields (rule 25; rv_phone.js + rv_phone_field_html(); Russell 2026-10-02) ---------------------------------------------------------
   [flag +code v] [number] for most countries; a fixed [flag +1] chip before the three boxes 3-3-4 for the US, military and territories. ONE look for every form. */
.rv-phonef [hidden] { display:none !important; }
.rv-phonef .rv-dialrow { display:flex; gap:8px; align-items:stretch; }
.rv-phonef .rv-dialrow .rv-phone-nat { flex:1 1 auto; min-width:0; }
.rv-phonef .rv-dial { position:relative; flex:none; }
.rv-phonef .rv-dial-btn, .rv-phonef .rv-dial-chip {
  display:inline-flex; align-items:center; gap:8px; height:100%; min-height:42px; padding:0 12px; width:auto;
  background:rgba(2,6,18,.45); color:var(--txt); border:1px solid var(--line2); border-radius:10px; font-size:14px; font-weight:600; white-space:nowrap; cursor:pointer;
}
.rv-phonef .rv-dial-chip { cursor:default; margin:0 8px 0 0; }
.rv-phonef .rv-dial-btn:hover, .rv-phonef .rv-dial-btn[aria-expanded="true"] { border-color:var(--accent2); }
.rv-phonef .rv-dial-caret { width:7px; height:7px; margin:-3px 0 0 2px; border:solid var(--muted); border-width:0 2px 2px 0; transform:rotate(45deg); }
.rv-phonef .rv-usphone { display:flex; align-items:stretch; }
.rv-phonef .paaddtel { display:flex; gap:8px; flex:0 0 auto; }
/* the three US boxes are as wide as what they hold PLUS 4 characters (Russell 10/2: plus 2, then 10/3: "still cramped", two more): 3 digits -> 7, 3 -> 7, 4 -> 8. ch = one digit of the box's own font; 16px = its padding + border. */
.rv-phonef .paaddtel input { flex:none; width:calc(7ch + 16px) !important; min-width:0; text-align:center; letter-spacing:0; }
.rv-phonef .paaddtel input.paaddress_telephone_3 { width:calc(8ch + 16px) !important; }
/* ONE green check for the whole number, after the last box, when all three boxes are good (Russell 10/3: "only one green check at the end, and not one in each box"). The boxes keep a neutral
   border; a bad box still goes red. Drawn here with the same check the other fields use, so it needs no markup. */
.rv-phonef .paaddtel::after { content:''; display:none; flex:none; width:22px; height:22px; align-self:center; margin-left:2px; background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2334d399' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12.5l4.5 4.5L19 7.5'/></svg>") center/contain no-repeat; }
.rv-phonef .paaddtel:has(.paaddress_telephone_1.rv-ok):has(.paaddress_telephone_2.rv-ok):has(.paaddress_telephone_3.rv-ok)::after { display:block; }
/* on a phone the fixed widths (7 / 7 / 8 characters at the phone's larger type) do not fit beside the +1 chip: the three boxes share what room there is, 3 : 3 : 4, and the row never runs off the card */
@media (max-width:600px) {
  .rv-phonef .rv-usphone { flex:1 1 auto; min-width:0; }
  .rv-phonef .paaddtel { flex:1 1 auto; min-width:0; }
  .rv-phonef .paaddtel input { flex:3 1 0; width:auto !important; min-width:0; }
  .rv-phonef .paaddtel input.paaddress_telephone_3 { flex:4 1 0; width:auto !important; }
  .rv-phonef .paaddtel::after { width:20px; height:20px; margin-left:0; }
}
.rv-phonef .rv-dial-list {
  position:absolute; z-index:60; left:0; top:calc(100% + 6px); width:min(340px, 86vw); max-height:min(46vh, 360px); overflow-y:auto; margin:0; padding:6px; list-style:none;
  background:var(--bg2); border:1px solid var(--line2); border-radius:12px; box-shadow:0 14px 34px rgba(0,0,0,.5); outline:none;
}
.rv-phonef .rv-dial-list li { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:8px; font-size:14px; cursor:pointer; }
.rv-phonef .rv-dial-list li.is-hot, .rv-phonef .rv-dial-list li:hover { background:rgba(34,211,238,.14); }
.rv-phonef .rv-dial-list li[aria-selected="true"] { box-shadow:inset 3px 0 0 var(--accent2); }
.rv-phonef .rv-dial-name { flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rv-phonef .rv-dial-num { flex:none; color:var(--muted); font-variant-numeric:tabular-nums; }
.rv-phonef .rvflag { flex:none; display:inline-block; }
.rv-phonef .rv-phonehint { margin:6px 0 0; font-size:12px; line-height:1.4; color:var(--warn); }
@media (max-width:600px) { .rv-phonef .rv-dial-btn, .rv-phonef .rv-dial-chip { padding:0 10px; } .rv-phonef .rv-dial-list { width:min(340px, calc(100vw - 48px)); } }

/* the three narrow US boxes hold digits, not digits AND a check mark: the green / red border carries the state there */
/* !important: the live-check rules above (input.rv-ok / rv-bad: icon + padding-right:34px !important) otherwise win, and in a box only 5 characters wide the icon left 9px for the digits
   ("727" showed as "7"; Russell 10/2 screenshot). The green / red border already says valid / not; the reason shows under the row. */
.rvtheme .rv-phonef .paaddtel input.rv-ok { border-color:var(--line2) !important; box-shadow:none !important; }   /* a good box is not outlined green: the one check after the three says it */
.rvtheme .rv-phonef .paaddtel input.rv-ok, .rvtheme .rv-phonef .paaddtel input.rv-bad { background-image:none !important; padding-right:6px !important; padding-left:6px !important; }
.rvtheme .rv-phonef .paaddtel input { padding-left:6px; padding-right:6px; }
@media (max-width:480px) { .rv-phonef .rv-dial-chip { padding:0 8px; gap:6px; margin-right:6px; } .rv-phonef .paaddtel { gap:6px; } }

/* the password field (checkout/pass_field.tpl): Step 1 sign-in, Register password + confirm. One look (it was written twice, in rv_checkout.css and rv_addrform.css); moved here 2026-10-03 so the sign-in page (#rv-login, account/login.tpl) shares it without loading the checkout's sheet. */
:is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-passrow { position:relative; display:block; }
:is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-passrow input { width:100%; padding-right:50px; }
/* Show / Hide is an eye badge INSIDE the box (Russell 10/8: he missed that there were two boxes); the second eye shows when the password is revealed */
:is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-passrow .rv-passtoggle { position:absolute; right:7px; top:50%; transform:translateY(-50%); width:32px; height:32px; min-height:0; margin:0; padding:0; display:inline-flex; align-items:center; justify-content:center; background:rgba(2,6,18,.55); border:1px solid var(--line2); border-radius:9px; color:var(--accent2); box-shadow:none; text-shadow:none; cursor:pointer; }
:is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-passrow .rv-passtoggle:hover, :is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-passrow .rv-passtoggle:focus-visible { border-color:var(--accent2); }
:is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-passrow .rv-passtoggle svg { display:block; width:18px; height:18px; }
:is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-passrow .rv-passtoggle .eye-off, :is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-passrow .rv-passtoggle[aria-pressed="true"] .eye { display:none; }
:is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-passrow .rv-passtoggle[aria-pressed="true"] .eye-off { display:block; }
:is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-capsnote { display:block; margin-top:6px; font-size:12px; color:var(--warn); }
:is(#rv-ck-steps, #rv-login, .rv-acctform, .rv-register) .rv-capsnote[hidden] { display:none; }

/* The re-themed sign-in page (account/login.tpl, #rv-login): the two cards sit in a column no wider than the other account pages' forms, from the same left edge. */
#rv-login .logingrid { max-width:860px; }
#rv-login .rowmsg { max-width:860px; margin-bottom:14px; }
#rv-login .logingrid .card { overflow:visible; }
#rv-login .loginbtns .btn { width:auto; min-width:120px; box-sizing:border-box; min-height:38px; justify-content:center; line-height:1.2; }   /* Sign In and Register the same size, side by side (the same values as .rv-btnrow in rv_addrform.css) */
@media (max-width:600px) { #rv-login .loginbtns .btn { width:100%; } }

/* ======================================================================
   INFORMATION PAGES (information/information_next.tpl, preview key 'Info Pages', 2026-10-07, ticket 2026-10-03_14-52-21_Russell): the admin-written content of
   About Us, Privacy, Shopping Terms, Delivery, Secure Payments, OEM, Models History, the guarantees, Site Info, Manufacturers. A readable line length, the
   content's own headings / lists / tables / images in the theme, nothing wider than the column on a phone. Content markup is the admin's: style elements, not classes.
   ====================================================================== */
.rv-shell-main .rvtheme.rv-info { background:none; padding:0; }
.rvtheme.rv-info .rv-info-body { max-width:860px; font-size:15px; line-height:1.65; color:var(--txt); overflow-wrap:anywhere; }
.rvtheme.rv-info .rv-info-body > :first-child { margin-top:0; }
.rvtheme.rv-info .rv-info-body p, .rvtheme.rv-info .rv-info-body ul, .rvtheme.rv-info .rv-info-body ol, .rvtheme.rv-info .rv-info-body table { margin:0 0 14px; }
.rvtheme.rv-info .rv-info-body ul, .rvtheme.rv-info .rv-info-body ol { padding-left:22px; }
.rvtheme.rv-info .rv-info-body li { margin:0 0 6px; }
.rvtheme.rv-info .rv-info-body h2, .rvtheme.rv-info .rv-info-body h3, .rvtheme.rv-info .rv-info-body h4 { color:var(--txt); margin:26px 0 10px; line-height:1.3; }
.rvtheme.rv-info .rv-info-body h2 { font-size:21px; } .rvtheme.rv-info .rv-info-body h3 { font-size:18px; } .rvtheme.rv-info .rv-info-body h4 { font-size:16px; }
.rvtheme.rv-info .rv-info-body strong, .rvtheme.rv-info .rv-info-body b { color:var(--txt); }
.rvtheme.rv-info .rv-info-body a { text-decoration:underline; text-underline-offset:2px; }
.rvtheme.rv-info .rv-info-body img { max-width:100%; height:auto; border-radius:8px; }
.rvtheme.rv-info .rv-info-body iframe { max-width:100%; }
.rvtheme.rv-info .rv-info-body table { max-width:100%; border-collapse:collapse; }
@media (max-width:760px) { .rvtheme.rv-info .rv-info-body table { display:block; overflow-x:auto; } }   /* a wide table scrolls on a phone; on a desktop it stays a table (2026-10-07) */
.rvtheme.rv-info .rv-info-body td, .rvtheme.rv-info .rv-info-body th { border:1px solid var(--line); padding:6px 10px; vertical-align:top; }
.rvtheme.rv-info .rv-info-body .video-wrapper { max-width:640px; margin:0 0 16px; }

/* SITE MAP (information/sitemap_next.tpl, key 'Sitemap', 2026-10-07): the category tree in one card, account + information links in two cards beside it (stacked on a phone). */
.rv-shell-main .rvtheme.rv-sitemap { background:none; padding:0; display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:16px; align-items:start; }
.rvtheme.rv-sitemap .rv-sm-side { display:grid; gap:16px; }
.rvtheme.rv-sitemap .card > h3 a { color:var(--txt); }
.rvtheme.rv-sitemap .rv-sm-list, .rvtheme.rv-sitemap .rv-sm-list ul { list-style:none; margin:0; padding:0; }
.rvtheme.rv-sitemap .rv-sm-list ul { padding-left:16px; border-left:1px solid var(--line); margin:4px 0 8px 4px; }
.rvtheme.rv-sitemap .rv-sm-list li { margin:0; padding:3px 0; font-size:14px; line-height:1.45; }
.rvtheme.rv-sitemap .rv-sm-list > li > a { font-weight:600; }
@media (max-width:760px) { .rv-shell-main .rvtheme.rv-sitemap { grid-template-columns:minmax(0,1fr); } }

/* REVIEWS (information/reviews_next.tpl + reviews_items.tpl, key 'Reviews', 2026-10-07) and the shared star rating (lib/rv_stars.php). */
.rvtheme .rv-stars { display:inline-flex; gap:1px; vertical-align:-2px; line-height:1; }
.rvtheme .rv-stars i { width:15px; height:15px; font-style:normal; }
.rvtheme .rv-stars i::before { content:"\2605"; display:block; font-size:15px; line-height:15px; color:rgba(148,163,184,.35); }
.rvtheme .rv-stars i.f::before { color:#fbbf24; }
.rvtheme .rv-stars i.h::before { background:linear-gradient(90deg,#fbbf24 50%,rgba(148,163,184,.35) 50%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.rv-shell-main .rvtheme.rv-reviews { background:none; padding:0; }
.rvtheme.rv-reviews .rv-rev-sum { display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; padding:14px 16px; margin:0 0 18px; border:1px solid var(--line); border-radius:14px; background:var(--panel); font-size:15px; }
.rvtheme.rv-reviews .rv-rev-love { font-size:18px; }
.rvtheme.rv-reviews .rv-rev-sum .rv-stars i { width:20px; height:20px; } .rvtheme.rv-reviews .rv-rev-sum .rv-stars i::before { font-size:20px; line-height:20px; }
.rvtheme.rv-reviews .rv-rev-list { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.rvtheme.rv-reviews .rv-rev { display:flex; gap:12px; padding:14px 16px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(180deg,rgba(30,41,59,.9),rgba(23,32,50,.9)); }
.rvtheme.rv-reviews .rv-rev-thumb { flex:0 0 52px; } .rvtheme.rv-reviews .rv-rev-thumb img { display:block; width:50px; height:50px; border-radius:8px; background:#fff; border:1px solid var(--line); }
.rvtheme.rv-reviews .rv-rev-main { min-width:0; flex:1; }
.rvtheme.rv-reviews .rv-rev-name { font-weight:700; }
.rvtheme.rv-reviews .rv-rev-meta { margin:4px 0 6px; font-size:13px; color:var(--muted); } .rvtheme.rv-reviews .rv-rev-meta b { color:var(--txt); }
.rvtheme.rv-reviews .rv-rev-text { margin:0; font-style:italic; font-size:14px; line-height:1.6; color:var(--txt); overflow-wrap:anywhere; }
.rvtheme.rv-reviews .rv-rev-reply { display:flex; gap:10px; margin:10px 0 0; padding:10px 0 0; border-top:1px dashed var(--line); font-size:14px; line-height:1.55; }
.rvtheme.rv-reviews .rv-rev-reply img { flex:none; width:24px; height:24px; }
.rvtheme.rv-reviews .rv-rev-more { margin:16px 0 0; } .rvtheme.rv-reviews .rv-rev-more .btn { width:auto; }
.rvtheme.rv-reviews .rv-rev-msg { margin:10px 0 0; font-size:13px; color:var(--muted); }

/* SMALL ACCOUNT FORMS (account/forgotten_next, reset_next, password_next, newsletter_next; 2026-10-07): one narrow card, the theme's fields / shared password box / buttons. */
.rv-shell-main .rvtheme.rv-acctform { background:none; padding:0; max-width:560px; }
.rvtheme.rv-acctform .rv-af-note { margin:0 0 14px; font-size:14px; line-height:1.55; color:var(--muted); }
.rvtheme.rv-acctform .rv-af-btns { display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; }
.rvtheme.rv-acctform .rv-af-btns .btn { width:auto; }
.rvtheme.rv-acctform .rv-af-choices { border:0; margin:0 0 14px; padding:0; }
.rvtheme.rv-acctform .rv-af-choices legend { margin:0 0 10px; font-size:14px; color:var(--txt); }
.rvtheme.rv-acctform .choice:has(> input:checked) { border-color:var(--good); background:rgba(52,211,153,.10); box-shadow:0 0 0 1px var(--good) inset; }   /* the .choice.on look, without a script */
.rvtheme.rv-acctform .field .err { display:block; margin-top:6px; }

/* Floated content images (information_next.tpl turns the content's inline float into these classes, 2026-10-07): one gap for every page; floats are cleared before
   headings and dividers (the Models History headings started beside the previous picture); on a phone nothing floats. .leftimg is the Secure Payments page's own wrapper. */
.rvtheme.rv-info .rv-info-body .rv-fl, .rvtheme.rv-info .rv-info-body .leftimg { float:left; margin:4px 22px 14px 0; }
.rvtheme.rv-info .rv-info-body .rv-fr { float:right; margin:4px 0 14px 22px; }
.rvtheme.rv-info .rv-info-body h2, .rvtheme.rv-info .rv-info-body h3, .rvtheme.rv-info .rv-info-body h4, .rvtheme.rv-info .rv-info-body hr { clear:both; }
.rvtheme.rv-info .rv-info-body hr { border:0; border-top:1px solid var(--line); margin:22px 0; }
.rvtheme.rv-info .rv-info-body::after { content:""; display:block; clear:both; }
@media (max-width:560px) { .rvtheme.rv-info .rv-info-body .rv-fl, .rvtheme.rv-info .rv-info-body .rv-fr, .rvtheme.rv-info .rv-info-body .leftimg { float:none; display:block; margin:0 0 14px; } }

/* PAGE GUARD live progress (rv_page_guard.js, preview key 'Guard Status', 2026-10-07): a spinner while the report is being handled, a check when it is fixed or checked,
   a plain note for a staff / test browser; the Refresh button glows once there is something to refresh for. Motion stops under prefers-reduced-motion. */
.rv-pageguard .rv-pg-live { display:flex; align-items:center; gap:10px; margin:0 0 14px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:rgba(2,6,18,.35); font-size:14px; color:var(--txt); }
.rv-pageguard .rv-pg-spin { flex:none; width:18px; height:18px; border-radius:50%; border:2px solid rgba(148,163,184,.35); border-top-color:var(--accent2); animation:rv-pg-spin .9s linear infinite; }
.rv-pageguard .rv-pg-live.is-done { border-color:rgba(52,211,153,.55); background:rgba(52,211,153,.10); }
.rv-pageguard .rv-pg-live.is-done .rv-pg-spin { animation:none; border:0; background:var(--good); position:relative; }
.rv-pageguard .rv-pg-live.is-done .rv-pg-spin::after { content:""; position:absolute; left:6px; top:3px; width:5px; height:9px; border:solid #06281d; border-width:0 2px 2px 0; transform:rotate(45deg); }
.rv-pageguard .rv-pg-live.is-note .rv-pg-spin { animation:none; border-color:var(--muted); }
.rv-pageguard .rv-pg-go { box-shadow:0 0 0 3px rgba(52,211,153,.55); }
@keyframes rv-pg-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .rv-pageguard .rv-pg-spin { animation-duration:3s; } }

/* CONTACT (information/contact_next.tpl, key 'Contact', 2026-10-07): the form beside a contact-information + map column (stacked on a phone); honeypots off screen. */
.rv-shell-main .rvtheme.rv-contact { background:none; padding:0; display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:18px; align-items:start; }
.rvtheme.rv-contact .rv-ct-req { margin:0 0 16px; font-size:12px; color:var(--muted); }
.rvtheme.rv-contact .rv-ct-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:0 16px; }
.rvtheme.rv-contact textarea { min-height:130px; }
.rvtheme.rv-contact .rv-ct-filegrid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
.rvtheme.rv-contact .rv-ct-filegrid input[type=file] { font-size:13px; color:var(--muted); padding:6px; }
.rvtheme.rv-contact .rv-ct-note { margin:8px 0 0; font-size:12px; color:var(--muted); }
.rvtheme.rv-contact .cf-turnstile { margin:4px 0 14px; }
.rvtheme.rv-contact .rv-ct-send { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:4px; }
.rvtheme.rv-contact .rv-ct-send .btn { width:auto; }
.rvtheme.rv-contact .rv-ct-sending { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; flex:1 1 280px; font-size:14px; color:var(--muted); }
.rvtheme.rv-contact .rv-ct-sending[hidden] { display:none; }
.rvtheme.rv-contact .rv-ct-sendtxt { flex:1 1 220px; min-width:0; }
.rvtheme.rv-contact .rv-ct-prog { flex:1 1 100%; width:100%; height:8px; border:0; border-radius:99px; overflow:hidden; background:rgba(148,163,184,.25); accent-color:var(--accent); }
.rvtheme.rv-contact .rv-ct-prog::-webkit-progress-bar { background:rgba(148,163,184,.25); } .rvtheme.rv-contact .rv-ct-prog::-webkit-progress-value { background:linear-gradient(90deg,var(--accent-ink),var(--accent2)); border-radius:99px; } .rvtheme.rv-contact .rv-ct-prog::-moz-progress-bar { background:var(--accent2); border-radius:99px; }
.rvtheme .rv-spin { display:none; flex:none; width:18px; height:18px; border:3px solid rgba(148,163,184,.35); border-top-color:var(--accent2); border-radius:50%; animation:rvspin .9s linear infinite; }
.rvtheme .is-busy .rv-spin { display:inline-block; }
@keyframes rvspin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .rvtheme .rv-spin { animation:none; border-top-color:var(--accent2); } }
.rvtheme.rv-contact .rv-hp { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.rvtheme.rv-contact .rv-ct-side { display:grid; gap:16px; }
.rvtheme.rv-contact .rv-ct-info { font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.rvtheme.rv-contact .rv-ct-info a { text-decoration:underline; }
.rvtheme.rv-contact .rv-ct-map iframe { display:block; width:100%; max-width:100%; height:240px; border:0; border-radius:10px; }
.rvtheme.rv-contact .field .err { display:block; margin-top:6px; }
.rvtheme.rv-contact .rv-ct-maplink { display:inline-block; margin-top:10px; font-size:13px; }
.rvtheme.rv-contact .rv-ct-map img { max-width:100%; height:auto; border-radius:10px; }
@media (max-width:860px) { .rv-shell-main .rvtheme.rv-contact { grid-template-columns:minmax(0,1fr); } }
@media (max-width:560px) { .rvtheme.rv-contact .rv-ct-grid, .rvtheme.rv-contact .rv-ct-filegrid { grid-template-columns:minmax(0,1fr); } }

/* ADMIN-WRITTEN TEXT (2026-10-07): staff highlight words in the CMS / store settings with an inline yellow background made for the old white page (white or dark text on
   #ffff00). On the dark theme that is unreadable, so a highlight becomes the theme's amber note -- the stored text is not rewritten (the old pages still show it).
   ONE rule for every place that shows such text: the repair intro (was in rv_repair.css), the information pages, the Contact Information card. The !important answers
   the inline style; nothing else here needs it. */
.rvtheme :is(.rv-repair-intro, .rv-info-body, .rv-ct-info) span[style*="background-color"] { background:rgba(245,158,11,.16) !important; color:#fde68a; padding:1px 6px; border-radius:6px; }

/* MY ACCOUNT (account/account_next.tpl, key 'My Account', 2026-10-07): three cards side by side (one column on a phone); links as a tidy list. */
.rv-shell-main .rvtheme.rv-myacct { background:none; padding:0; }
.rvtheme.rv-myacct .rv-ma-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; align-items:start; }
.rvtheme.rv-myacct .rv-ma-links { list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.rvtheme.rv-myacct .rv-ma-links a { display:block; padding:8px 10px; border-radius:8px; color:var(--txt); font-size:14px; }
.rvtheme.rv-myacct .rv-ma-links a:hover { background:rgba(96,165,250,.10); text-decoration:none; color:var(--accent2); }
.rvtheme.rv-myacct .rv-ma-ms { margin:0 0 6px; font-size:15px; color:var(--txt); }
.rvtheme.rv-myacct .rv-ma-note { margin:0 0 14px; font-size:13px; color:var(--muted); }
.rvtheme.rv-myacct .btn { width:auto; }
.rvtheme.rv-myacct .rv-ma-wholesale { display:inline-block; margin:0 0 16px; font-weight:700; }
.rvtheme.rv-myacct .rowmsg { margin:0 0 16px; }
@media (max-width:860px) { .rvtheme.rv-myacct .rv-ma-grid { grid-template-columns:minmax(0,1fr); } }

/* a dialog's lead sentence never sits on the field label under it (the discontinued-item confirm, 2026-10-07) */
dialog.rv-dialog .rv-lead + .field { margin-top:14px; }

/* LISTINGS + THE PRODUCT CARD (product/rv_pcard.tpl, product/manufacturer_info_next.tpl, key 'Brand Pages', 2026-10-07): one responsive grid of cards, a toolbar, the controller's paging. */
.rvtheme .rv-pgrid { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:14px; }
.rvtheme .rv-pcard { position:relative; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:linear-gradient(180deg,rgba(30,41,59,.9),rgba(23,32,50,.9)); }
.rvtheme .rv-pcard:hover { border-color:var(--accent); }
.rvtheme .rv-pc-img { display:flex; align-items:center; justify-content:center; aspect-ratio:1 / 1; background:#fff; }
.rvtheme .rv-pc-img img { display:block; max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; }
.rvtheme .rv-pc-noimg { color:#64748b; font-size:13px; }
.rvtheme .rv-pc-badge { position:absolute; top:10px; left:10px; padding:3px 10px; border-radius:999px; font-size:11px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; background:rgba(245,158,11,.92); color:#2a1700; }
.rvtheme .rv-pc-body { flex:0 0 auto; display:flex; flex-direction:column; gap:6px; padding:12px 14px 4px; min-width:0; }
.rvtheme .rv-pc-name { font-weight:700; font-size:15px; line-height:1.3; color:var(--txt); overflow-wrap:anywhere; }
.rvtheme .rv-pc-model { font-size:12px; color:var(--muted); }
.rvtheme .rv-pc-rate { line-height:1; }
.rvtheme .rv-pc-desc { margin:0; font-size:13px; line-height:1.5; color:var(--muted); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.rvtheme .rv-pc-price { padding-top:4px; font-size:18px; font-weight:800; color:var(--txt); }
.rvtheme .rv-pc-was { font-size:14px; font-weight:600; color:var(--muted); text-decoration:line-through; }
.rvtheme .rv-pc-sale { color:#f87171; }
.rvtheme .rv-pc-tax { display:block; font-size:12px; font-weight:500; color:var(--muted); }
.rvtheme .rv-pc-act { padding:10px 14px 14px; display:grid; gap:8px; }
.rvtheme .rv-pc-buy { width:100%; justify-content:center; }
.rvtheme .rv-pc-sub { display:flex; justify-content:space-between; gap:8px; }
.rvtheme .rv-pc-link { width:auto; padding:2px 0; border:0; background:none; color:var(--accent2); font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; }
.rvtheme .rv-pc-link:hover { text-decoration:underline; }
.rvtheme .rv-pc-link:disabled { opacity:.5; cursor:default; }
.rvtheme .rv-pc-msg { margin:0; font-size:12.5px; line-height:1.4; color:var(--txt); }
.rvtheme .rv-pc-msg.is-ok { color:var(--good); } .rvtheme .rv-pc-msg.is-err { color:var(--bad); } .rvtheme .rv-pc-msg[hidden] { display:none; }
.rvtheme .rv-pager { margin:22px 0 0; text-align:center; }
.rvtheme .rv-pager .links { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; }
.rvtheme .rv-pager .links a, .rvtheme .rv-pager .links b { display:inline-block; min-width:36px; padding:7px 11px; border:1px solid var(--line); border-radius:9px; font-size:14px; text-align:center; }
.rvtheme .rv-pager .links a { color:var(--txt); background:var(--panel); } .rvtheme .rv-pager .links a:hover { border-color:var(--accent); text-decoration:none; }
.rvtheme .rv-pager .links b { background:linear-gradient(135deg,var(--accent-ink),var(--accent-ink2)); border-color:transparent; color:#fff; }
.rvtheme .rv-pager .results { margin-top:10px; font-size:13px; color:var(--muted); }
@media (max-width:560px) { .rvtheme .rv-pgrid { grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; } .rvtheme .rv-pc-body { padding:10px 10px 2px; } .rvtheme .rv-pc-act { padding:8px 10px 12px; } .rvtheme .rv-pc-sub { flex-direction:column; gap:2px; } }

/* A brand page's logo (information_next.tpl serving product/mfr.php content, 2026-10-07): the stored text opens with the logo inline in its first paragraph; it floats left with the same gap as every other image, and sits above the text on a phone. */
.rvtheme.rv-info .rv-info-body #brands > p:first-child > img:first-child { float:left; margin:2px 22px 12px 0; }
@media (max-width:560px) { .rvtheme.rv-info .rv-info-body #brands > p:first-child > img:first-child { float:none; display:block; margin:0 0 14px; } }

/* ACCOUNT PAGES (re-themed My Account pages: Video Library, Rewards, and the ones behind them; 2026-10-07, ticket 2026-10-03_14-52-21_Russell). ONE set of pieces:
   .rv-acctpage (the column), .rv-ap-* (intro, empty note, stat tile, button row), .rv-tbl (the table: a table on a desktop, stacked labelled rows on a phone, via td[data-label]). */
.rv-shell-main .rvtheme.rv-acctpage { background:none; padding:0; display:grid; gap:16px; max-width:1100px; }
.rvtheme.rv-acctpage .rv-ap-intro { margin:0; font-size:14px; line-height:1.6; color:var(--muted); }
.rvtheme.rv-acctpage .rv-ap-empty { margin:0; font-size:14px; color:var(--muted); }
.rvtheme.rv-acctpage .rv-ap-count { display:inline-block; margin-left:6px; padding:1px 9px; border-radius:999px; background:rgba(96,165,250,.14); color:var(--accent2); font-size:12px; font-weight:700; vertical-align:1px; }
.rvtheme.rv-acctpage .rv-ap-stat { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; padding:14px 18px; border:1px solid var(--line); border-radius:14px; background:var(--panel); }
.rvtheme.rv-acctpage .rv-ap-statlab { font-size:13px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; color:var(--muted); }
.rvtheme.rv-acctpage .rv-ap-statnum { font-size:28px; font-weight:800; color:var(--txt); }
.rvtheme.rv-acctpage .rv-ap-btns { display:flex; flex-wrap:wrap; gap:10px; } .rvtheme.rv-acctpage .rv-ap-btns .btn { width:auto; }
.rvtheme.rv-acctpage .rv-pager { margin:0; }
.rvtheme .rv-tblwrap { padding:0; overflow-x:auto; }
.rvtheme .rv-tbl { width:100%; border-collapse:collapse; font-size:14px; }
.rvtheme .rv-tbl th { padding:11px 16px; text-align:left; font-size:12px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; color:var(--muted); border-bottom:1px solid var(--line); white-space:nowrap; }
.rvtheme .rv-tbl td { padding:12px 16px; border-bottom:1px solid rgba(148,163,184,.14); vertical-align:top; color:var(--txt); }
.rvtheme .rv-tbl tbody tr:last-child td { border-bottom:0; }
/* the base theme ("table tr:first-child td") dresses the first row of ANY table as a header; a body row is not one */
.rvtheme .rv-tbl tbody tr:first-child td { font-size:14px; font-weight:400; letter-spacing:normal; text-transform:none; color:var(--txt); background:transparent; border-bottom:1px solid rgba(148,163,184,.14); }
.rvtheme .rv-tbl tbody tr:first-child:last-child td { border-bottom:0; }
.rvtheme .rv-tbl tbody tr:hover td { background:rgba(96,165,250,.05); }
.rvtheme .rv-tbl .num { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.rvtheme .rv-tbl .rv-tbl-act { text-align:right; white-space:nowrap; }
@media (max-width:640px) {
  .rvtheme .rv-tbl thead { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
  .rvtheme .rv-tbl, .rvtheme .rv-tbl tbody, .rvtheme .rv-tbl tr, .rvtheme .rv-tbl td { display:block; width:100%; }
  .rvtheme .rv-tbl tr { padding:10px 14px; border-bottom:1px solid var(--line); } .rvtheme .rv-tbl tbody tr:last-child { border-bottom:0; }
  .rvtheme .rv-tbl td { display:flex; justify-content:space-between; gap:14px; padding:5px 0; border:0; text-align:right; }
  .rvtheme .rv-tbl td::before { content:attr(data-label); flex:none; font-size:12px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; color:var(--muted); text-align:left; }
  .rvtheme .rv-tbl td[data-label=""]::before { content:none; } .rvtheme .rv-tbl td.num, .rvtheme .rv-tbl td.rv-tbl-act { text-align:right; }
}
.rvtheme .rv-vgrid { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:16px; }
.rvtheme .rv-vtile { min-width:0; }
.rvtheme .rv-vthumb { position:relative; display:block; border-radius:10px; overflow:hidden; background:#000; aspect-ratio:16 / 9; }
.rvtheme .rv-vthumb img { display:block; width:100%; height:100%; object-fit:cover; }
.rvtheme .rv-vplay { position:absolute; left:50%; top:50%; width:38px; height:38px; margin:-19px 0 0 -19px; border-radius:50%; background:rgba(2,6,18,.62); border:2px solid rgba(255,255,255,.85); }
.rvtheme .rv-vplay::after { content:""; position:absolute; left:14px; top:9px; border-style:solid; border-width:8px 0 8px 13px; border-color:transparent transparent transparent #fff; }
.rvtheme .rv-vthumb:hover .rv-vplay { background:var(--accent-ink); }
.rvtheme .rv-vname { display:block; margin-top:8px; font-size:13px; line-height:1.35; font-weight:600; color:var(--txt); }
@media (max-width:960px) { .rvtheme .rv-vgrid { grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width:560px) { .rvtheme .rv-vgrid { grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; } }

/* ACCOUNT PAGES, part 2 (affiliate pages, the plain message page): stat tiles in a row, status badges, a narrow single card. */
.rvtheme.rv-acctpage .rv-ap-stats { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; }
.rvtheme.rv-acctpage .rv-ap-stats .rv-ap-stat { flex-direction:column; align-items:flex-start; gap:4px; }
.rvtheme .rv-badge { display:inline-block; padding:2px 10px; border-radius:999px; font-size:12px; font-weight:700; letter-spacing:.2px; border:1px solid transparent; }
.rvtheme .rv-badge.is-ok { background:rgba(16,185,129,.14); border-color:rgba(16,185,129,.4); color:#6ee7b7; }
.rvtheme .rv-badge.is-wait { background:rgba(245,158,11,.14); border-color:rgba(245,158,11,.4); color:#fcd34d; }
.rvtheme .rv-badge.is-off { background:rgba(148,163,184,.14); border-color:rgba(148,163,184,.35); color:#cbd5e1; }
.rvtheme .rv-badge.is-bad { background:rgba(248,113,113,.14); border-color:rgba(248,113,113,.4); color:#fca5a5; }
.rv-shell-main .rvtheme.rv-acctpage.rv-ap-narrow { max-width:640px; }
.rvtheme .rv-ap-message { font-size:15px; line-height:1.65; color:var(--txt); } .rvtheme .rv-ap-message p { margin:0 0 12px; }
@media (max-width:640px) { .rvtheme.rv-acctpage .rv-ap-stats { grid-template-columns:minmax(0,1fr); } }

/* WISH LIST (account/wishlist_next.tpl, key 'Wish List', 2026-10-07): the shared product card grid plus an availability line and the Remove link. */
.rvtheme .rv-pc-stock { font-size:12.5px; font-weight:600; color:var(--good); }
.rvtheme .rv-pc-remove { color:var(--muted); } .rvtheme .rv-pc-remove:hover { color:var(--bad); text-decoration:none; }
.rvtheme.rv-wish .rv-pc-sub { justify-content:flex-end; }
.rvtheme.rv-wish .rv-ap-btns { margin-top:18px; }
/* the card's text links (Compare, Wish List, Remove) are small plain links: the home shell's bare `button` rule (uppercase, glow, lift on hover, shimmer) must not reach the two that are <button>s */
.rvtheme .rv-pc-link { text-transform:none; letter-spacing:normal; box-shadow:none; animation:none; margin:0; overflow:visible; border-radius:0; transform:none; text-align:left; line-height:1.4; }
.rvtheme .rv-pc-link::before { content:none; }
.rvtheme .rv-pc-link:hover { transform:none; box-shadow:none; }
.rvtheme .rv-pc-sub { align-items:center; }
.rvtheme .rv-pc-remove { font-size:12.5px; font-weight:600; }

/* CONTACT part 2 (2026-10-07): the ZIP's one-line state note (written by rv_postal_autofill.js, which colors it inline for a white page) reads on the dark card; the state list and country list look alike */
.rvtheme.rv-contact .rv-postal-note { margin:6px 0 0; min-height:0; font-size:12.5px; line-height:1.4; color:var(--good) !important; }
.rvtheme.rv-contact .rv-postal-note:empty { display:none; }
.rvtheme.rv-contact select:disabled { opacity:.7; cursor:not-allowed; }

/* RETURNS (account/return_list_next.tpl, return_info_next.tpl, return_form_next.tpl, key 'Returns', 2026-10-07): a labeled key/value list, the request form's grids and choice rows. */
.rvtheme .rv-kv { margin:0; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px 24px; }
.rvtheme .rv-kv > div { min-width:0; }
.rvtheme .rv-kv dt { margin:0 0 3px; font-size:12px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; color:var(--muted); }
.rvtheme .rv-kv dd { margin:0; font-size:15px; color:var(--txt); overflow-wrap:anywhere; }
.rvtheme.rv-return .rv-ap-intro p { margin:0 0 4px; }
.rvtheme.rv-return .card { margin:0 0 16px; }
.rvtheme.rv-return .rv-rt-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:0 16px; }
.rvtheme.rv-return .rv-rt-item { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,1.3fr) minmax(0,.8fr); gap:0 16px; }
.rvtheme.rv-return fieldset.field { border:0; margin:0 0 14px; padding:0; min-width:0; }
.rvtheme.rv-return fieldset.field legend { padding:0; margin:0 0 8px; font-size:12px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; color:var(--muted); }
.rvtheme.rv-return .rv-check { display:flex; align-items:center; gap:10px; margin:0 0 6px; font-size:15px; text-transform:none; letter-spacing:normal; font-weight:500; color:var(--txt); cursor:pointer; }
.rvtheme.rv-return .rv-check input[type=radio] { width:18px; height:18px; margin:0; flex:none; accent-color:var(--accent); }
.rvtheme.rv-return .rv-rt-opened { display:flex; flex-wrap:wrap; gap:4px 22px; align-items:center; } .rvtheme.rv-return .rv-rt-opened legend { flex:0 0 100%; }
.rvtheme.rv-return .rv-rt-opened .rv-check { margin:0; }
.rvtheme.rv-return .rv-ap-btns .btn { width:auto; }
@media (max-width:640px) { .rvtheme .rv-kv, .rvtheme.rv-return .rv-rt-grid, .rvtheme.rv-return .rv-rt-item { grid-template-columns:minmax(0,1fr); } }
.rvtheme.rv-acctpage .rv-tbl .btn { width:auto; padding:8px 16px; font-size:13px; margin:0; }
.rvtheme.rv-return .rv-ap-btns { align-items:center; }
.rvtheme.rv-return .rv-ap-btns .btn { margin:0; }

/* ORDERS (account/order_list_next.tpl, order_info_next.tpl, key 'Orders', 2026-10-07): blue status (a return), the balance dash, row actions, the order page's address pair, totals and file list. */
.rvtheme .rv-badge.is-info { background:rgba(56,189,248,.14); border-color:rgba(56,189,248,.4); color:#7dd3fc; }
.rvtheme .rv-ord-nobal { color:var(--muted); }
.rvtheme.rv-orders .rv-ord-act { white-space:nowrap; } .rvtheme.rv-orders .rv-ord-act .btn { margin-left:6px; }
.rvtheme.rv-orders .rv-tbl td b { font-weight:700; }
.rvtheme.rv-orderinfo .card { margin:0 0 16px; }
.rvtheme.rv-orderinfo .rv-oi-addr { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:0 16px; }
.rvtheme.rv-orderinfo .rv-oi-address { font-size:14.5px; line-height:1.6; color:var(--txt); overflow-wrap:anywhere; }
/* the status in the page title: the title sits OUTSIDE .rvtheme, so this badge carries its own colors */
.rv-h1badge { display:inline-block; vertical-align:middle; margin-left:10px; padding:4px 12px; border-radius:999px; font-size:13px; font-weight:700; letter-spacing:.2px; border:1px solid transparent; }
.rv-h1badge.is-ok { background:rgba(16,185,129,.14); border-color:rgba(16,185,129,.4); color:#6ee7b7; }
.rv-h1badge.is-wait { background:rgba(245,158,11,.14); border-color:rgba(245,158,11,.4); color:#fcd34d; }
.rv-h1badge.is-bad { background:rgba(248,113,113,.14); border-color:rgba(248,113,113,.4); color:#fca5a5; }
.rv-h1badge.is-info { background:rgba(56,189,248,.14); border-color:rgba(56,189,248,.4); color:#7dd3fc; }
.rvtheme .rv-oi-totals { margin:16px 0 0 auto; padding:0; max-width:380px; display:grid; gap:6px; }
.rvtheme .rv-oi-totals > div { display:flex; justify-content:space-between; gap:16px; align-items:center; font-size:14.5px; }
.rvtheme .rv-oi-totals dt { margin:0; color:var(--muted); font-weight:600; } .rvtheme .rv-oi-totals dd { margin:0; text-align:right; color:var(--txt); font-weight:600; }
.rvtheme .rv-oi-totals .rv-oi-bal { margin-top:6px; padding-top:10px; border-top:1px solid var(--line); }
.rvtheme .rv-oi-files { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px 22px; } .rvtheme .rv-oi-files a { font-weight:600; }
.rvtheme.rv-orderinfo .rv-tbl td .btn { width:auto; padding:6px 14px; font-size:12.5px; margin:0; }
@media (max-width:640px) { .rvtheme.rv-orderinfo .rv-oi-addr { grid-template-columns:minmax(0,1fr); } .rvtheme.rv-orders .rv-ord-act { white-space:normal; } .rvtheme .rv-oi-totals { max-width:none; } }

/* SAVED PAYMENT METHODS (account/payment_next.tpl, key 'Saved Payments', 2026-10-07): one row per saved bank account / card. */
.rvtheme.rv-paymeth .card { margin:0 0 16px; }
.rvtheme .rv-pm-note { margin:0 0 14px; font-size:13px; line-height:1.55; color:var(--muted); }
.rvtheme .rv-pm-row { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; padding:12px 14px; margin:0 0 10px; border:1px solid var(--line); border-radius:12px; background:rgba(15,23,42,.45); }
.rvtheme .rv-pm-main { flex:2 1 240px; min-width:0; display:flex; flex-direction:column; gap:2px; overflow-wrap:anywhere; }
.rvtheme .rv-pm-main b { font-size:15px; color:var(--txt); } .rvtheme .rv-pm-main span { font-size:13.5px; color:var(--muted); }
.rvtheme .rv-pm-status { flex:1 1 180px; font-size:13px; color:var(--muted); }
.rvtheme .rv-pm-act { flex:0 0 auto; margin-left:auto; }
.rvtheme .rv-pm-act .btn { width:auto; padding:8px 18px; font-size:13px; margin:0; }
@media (max-width:560px) { .rvtheme .rv-pm-act { margin-left:0; width:100%; } .rvtheme .rv-pm-act .btn { width:100%; } }

/* ORDERS part 2 (Russell 10/7): the two row buttons sit in a fixed-width cell of two equal columns, so View Order and Reorder / Retry line up on every row */
.rvtheme.rv-orders .rv-ord-act { width:330px; white-space:nowrap; }
.rvtheme.rv-orders .rv-ord-act .btn { display:inline-flex; align-items:center; justify-content:center; width:136px; margin:0 0 0 8px; padding:8px 0; box-sizing:border-box; }
.rvtheme.rv-orders .rv-ord-act .btn:first-child { margin-left:0; }
@media (max-width:640px) { .rvtheme.rv-orders .rv-ord-act { width:auto; white-space:normal; } .rvtheme.rv-orders .rv-ord-act .btn { width:calc(50% - 4px); } }

/* ORDERS part 3 (Russell 10/7): the row buttons are color coded: View Order blue, Retry green, Reorder light green */
.rvtheme.rv-orders .rv-ord-act .btn { animation:none; text-shadow:none; }
.rvtheme.rv-orders .rv-ord-act .rv-bt-view { background:linear-gradient(135deg,#1d4ed8,#2563eb); border:1px solid #3b82f6; color:#fff; box-shadow:0 2px 8px rgba(37,99,235,.35); }
.rvtheme.rv-orders .rv-ord-act .rv-bt-retry { background:linear-gradient(135deg,#15803d,#16a34a); border:1px solid #22c55e; color:#fff; box-shadow:0 2px 8px rgba(22,163,74,.35); }
.rvtheme.rv-orders .rv-ord-act .rv-bt-reorder { background:linear-gradient(135deg,#86efac,#bbf7d0); border:1px solid #86efac; color:#052e16; box-shadow:0 2px 8px rgba(134,239,172,.3); }
.rvtheme.rv-orders .rv-ord-act .rv-bt-view:hover { background:linear-gradient(135deg,#2563eb,#3b82f6); box-shadow:0 4px 12px rgba(37,99,235,.5); }
.rvtheme.rv-orders .rv-ord-act .rv-bt-retry:hover { background:linear-gradient(135deg,#16a34a,#22c55e); box-shadow:0 4px 12px rgba(22,163,74,.5); }
.rvtheme.rv-orders .rv-ord-act .rv-bt-reorder:hover { background:linear-gradient(135deg,#bbf7d0,#dcfce7); box-shadow:0 4px 12px rgba(134,239,172,.5); }

/* ORDERS part 4 (Russell 10/7): the time sits under the date in the order history */
.rvtheme .rv-oi-time { display:block; margin-top:2px; font-size:12.5px; color:var(--muted); }
@media (max-width:640px) { .rvtheme .rv-tbl td .rv-oi-time { display:inline; margin:0 0 0 8px; } }

/* ORDER COMPLETE (checkout/success_next.tpl, key 'Order Complete', 2026-10-07): the thank-you hero, the message cards, the order recap, and the "remind me when due" card (built by the controller for a white
   page; restyled here for the dark one, scoped to .rv-success so nothing else changes). */
.rvtheme.rv-success .card { margin:0 0 16px; }
.rvtheme .rv-ss-hero { display:flex; align-items:center; flex-wrap:wrap; gap:14px 18px; margin:0 0 16px; padding:18px 22px; border:1px solid rgba(16,185,129,.45); border-radius:14px; background:linear-gradient(135deg,rgba(16,185,129,.2),rgba(99,102,241,.14)); }
.rvtheme .rv-ss-ico { flex:none; color:var(--good); }
.rvtheme .rv-ss-herotxt { flex:1 1 280px; min-width:0; }
.rvtheme .rv-ss-hero h1 { margin:0 0 4px; font-size:24px; line-height:1.25; color:var(--txt); }
.rvtheme .rv-ss-num { margin:0; font-size:16px; color:var(--muted); } .rvtheme .rv-ss-num b { color:var(--txt); font-size:18px; }
.rvtheme .rv-ss-hero .rv-ss-again { width:auto; margin:0; flex:none; }
.rvtheme .rv-ss-msg p { margin:0 0 10px; font-size:15px; line-height:1.6; } .rvtheme .rv-ss-msg p:last-child { margin:0; }
.rvtheme .rv-ss-note { margin:0 0 14px; font-size:13.5px; line-height:1.55; color:var(--muted); }
.rvtheme .rv-ss-items .rv-ss-imgcol { width:72px; } .rvtheme .rv-ss-items img { display:block; width:56px; height:56px; object-fit:contain; background:#fff; border-radius:8px; padding:2px; }
.rvtheme .rv-ss-items small { color:var(--muted); }
.rvtheme.rv-success .rv-ss-out { margin-top:4px; }
@media (max-width:640px) { .rvtheme .rv-ss-hero .rv-ss-again { width:100%; } .rvtheme .rv-ss-items td.rv-ss-imgcol { width:auto; } .rvtheme .rv-ss-items td.rv-ss-imgcol:empty { display:none; } }
.rvtheme.rv-success .rvso { max-width:none; margin:0 0 16px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(180deg,rgba(30,41,59,.9),rgba(23,32,50,.9)); box-shadow:none; color:var(--txt); }
.rvtheme.rv-success .rvso-head { background:linear-gradient(120deg,rgba(30,64,175,.55),rgba(79,70,229,.5)); }
.rvtheme.rv-success .rvso-row { border-bottom-color:var(--line); }
.rvtheme.rv-success .rvso-txt { color:var(--txt); } .rvtheme.rv-success .rvso-sub { color:var(--muted); } .rvtheme.rv-success .rvso-sub b { color:var(--txt); }
.rvtheme.rv-success .rvso-row img { background:#fff; border-color:var(--line); }
.rvtheme.rv-success .rvso-foot { border-top-color:var(--line); background:rgba(15,23,42,.45); }
.rvtheme.rv-success .rvso-btn { width:auto; margin:0; padding:11px 22px; border-radius:10px; font-size:14px; }
.rvtheme.rv-success .rvso-note { color:var(--muted); }
.rvtheme.rv-success .rvso-ok { background:rgba(16,185,129,.12); border-top-color:rgba(16,185,129,.4); color:#a7f3d0; }
/* Order Complete part 2: the offer's rows are <label>s, which the home shell's bare `label` rule turns into capitals; the Save button is as wide as its text */
.rvtheme.rv-success .rvso-row, .rvtheme.rv-success .rvso-row * { text-transform:none; letter-spacing:normal; }
.rvtheme.rv-success .rvso-sub { font-size:12.5px; font-weight:400; }
.rvtheme .rv-ss-save .btn { width:auto; margin:0; }
/* message pages (sign out, return sent, session expired; Russell 10/7): room between the text and the Continue button */
.rvtheme .rv-ap-message .rv-ap-btns { margin-top:24px; }

/* carrier logo badge in the order's shipment tracking (Russell 10/7): the logos are colored for a white page, so they sit on a white chip, as the product pictures do */
.rvtheme .rv-carrier-logo { display:inline-block; vertical-align:middle; height:26px; width:auto; max-width:72px; margin-right:8px; padding:3px 8px; border-radius:7px; background:#fff; object-fit:contain; box-sizing:content-box; }
.rvtheme .rv-carrier-name { vertical-align:middle; }
/* Order Complete: Sign Out is a normal-size button on the left, amber (it leaves the account: unlike blue = look, green = go / save, purple = continue) */
.rvtheme .rv-ss-out { justify-content:flex-start; }
.rvtheme .btn.rv-bt-signout { width:auto; margin:0; background:linear-gradient(135deg,#d97706,#f59e0b); border:1px solid #fbbf24; color:#1c1200; text-shadow:none; box-shadow:0 2px 8px rgba(245,158,11,.35); animation:none; }
.rvtheme .btn.rv-bt-signout:hover { background:linear-gradient(135deg,#f59e0b,#fbbf24); box-shadow:0 4px 12px rgba(245,158,11,.5); }

/* the order's Files (Invoice, Packing List, Customs Invoice, Media Gallery; Russell 10/7: "these do not look like links"): theme buttons in a wrapping row */
.rvtheme .rv-oi-files { gap:10px; }
.rvtheme .rv-oi-files .btn { width:auto; margin:0; padding:10px 20px; }

/* REGISTER (account/register_next, register_confirm_next; preview key "Register", 2026-10-07): the checkout's Register form on its own page, the address-decision screen, the code box. */
.rvtheme.rv-register .rv-af-note { margin:0 0 14px; font-size:14px; line-height:1.55; color:var(--muted); }
.rvtheme.rv-register .rowmsg { margin:0 0 14px; }
.rvtheme.rv-register .rv-hp { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.rvtheme.rv-register .rv-af-choices { border:0; margin:0 0 6px; padding:0; }
.rvtheme.rv-register .rv-af-choices legend { margin:0 0 10px; font-size:14px; color:var(--txt); }
.rvtheme.rv-register .choice:has(> input:checked) { border-color:var(--good); background:rgba(52,211,153,.10); box-shadow:0 0 0 1px var(--good) inset; }
.rvtheme.rv-regdecide .rv-reg-cmp { margin:0 0 16px; display:grid; grid-template-columns:max-content 1fr; gap:8px 16px; }
.rvtheme.rv-regdecide .rv-reg-cmp dt { color:var(--muted); font-size:14px; }
.rvtheme.rv-regdecide .rv-reg-cmp dd { margin:0; line-height:1.5; }
.rvtheme.rv-regdecide .rv-af-btns form { margin:0; }
.rvtheme.rv-regdecide .rv-reg-pobox { margin:0 0 16px; }
.rvtheme.rv-regconfirm .rowmsg { margin:0 0 14px; }
.rvtheme.rv-regconfirm .rv-codebox { font-size:1.6em; letter-spacing:.3em; text-align:center; }
.rvtheme.rv-regconfirm .rv-reg-resend { margin-top:14px; }
.rvtheme.rv-regconfirm .rv-reg-resend .rv-linkbtn { background:none; border:0; box-shadow:none; padding:0; width:auto; min-height:0; color:var(--accent); text-decoration:underline; text-transform:none; letter-spacing:normal; font:inherit; font-weight:600; cursor:pointer; }
.rvtheme.rv-register .rv-cols + .rv-cols { margin-top:16px; }

/* the Details button + popup on the shared product card (preview key "Card Details", 2026-10-08, Russell: like the Details popup on the schematic page, with a link to the full page) */
.rvtheme .rv-pc-btns { display:flex; gap:8px; align-items:stretch; }
.rvtheme .rv-pc-btns .rv-pc-buy { flex:1 1 auto; width:auto; min-width:0; }
.rvtheme .rv-pc-btns .rv-pc-details { flex:0 0 auto; width:auto; justify-content:center; }
@media (max-width:560px) { .rvtheme .rv-pc-btns { flex-wrap:wrap; } .rvtheme .rv-pc-btns .rv-pc-buy, .rvtheme .rv-pc-btns .rv-pc-details { flex:1 1 100%; } }
dialog.rv-pc-dlg { width:min(94vw, 820px); }
dialog.rv-pc-dlg .rv-pcd { display:grid; grid-template-columns:minmax(0, 280px) minmax(0, 1fr); gap:22px; align-items:start; }
dialog.rv-pc-dlg .rv-pcd-img { background:#fff; border-radius:12px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
dialog.rv-pc-dlg .rv-pcd-img img { display:block; width:100%; height:auto; max-height:46vh; object-fit:contain; }
dialog.rv-pc-dlg .rv-pcd-body h3 { margin:0 28px 6px 0; font-size:20px; line-height:1.3; }
dialog.rv-pc-dlg .rv-pcd-price { margin:0 0 12px; }
dialog.rv-pc-dlg .rv-pcd-desc { font-size:14px; line-height:1.6; max-height:34vh; overflow:auto; padding-right:6px; }
dialog.rv-pc-dlg .rv-pcd-desc p { margin:0 0 10px; }
dialog.rv-pc-dlg .rv-pcd-desc ul, dialog.rv-pc-dlg .rv-pcd-desc ol { margin:0 0 10px; padding-left:20px; }
dialog.rv-pc-dlg .rv-pcd-desc a { color:var(--accent2); text-decoration:underline; }
dialog.rv-pc-dlg .rv-pcd-desc.is-none { color:var(--muted); font-style:italic; }
dialog.rv-pc-dlg .rv-pcd-acts { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
dialog.rv-pc-dlg .rv-pcd-acts .btn { width:auto; text-decoration:none; }
@media (max-width:640px) { dialog.rv-pc-dlg .rv-pcd { grid-template-columns:1fr; gap:14px; } dialog.rv-pc-dlg .rv-pcd-img img { max-height:30vh; } dialog.rv-pc-dlg .rv-pcd-desc { max-height:26vh; } }
.rvtheme .rv-pc-btns .btn { padding-left:12px; padding-right:12px; letter-spacing:.04em; white-space:nowrap; }
.rvtheme dialog.rv-pc-dlg .rv-pcd-zoom, dialog.rv-pc-dlg .rv-pcd-zoom { display:block; width:100%; margin:0; padding:0; border:0; background:none; box-shadow:none; cursor:zoom-in; }
dialog.rv-pc-dlg .rv-pcd-zoom:focus-visible { outline:2px solid var(--accent2); outline-offset:-2px; }
/* the shared Details popup, second pass (2026-10-08: the schematic page's popup re-themed onto it): rating under the photo, the facts list, OEM badge, quantity + Add to Cart */
dialog.rv-pc-dlg .rv-pcd-side { min-width:0; }
dialog.rv-pc-dlg .rv-pcd-rate { margin-top:10px; text-align:center; font-size:13px; color:var(--muted); }
dialog.rv-pc-dlg .rv-pcd-rate .rv-stars { vertical-align:middle; margin-right:6px; }
dialog.rv-pc-dlg .rv-pcd-facts { display:grid; grid-template-columns:max-content 1fr; gap:3px 12px; margin:0 0 10px; font-size:14px; }
dialog.rv-pc-dlg .rv-pcd-facts dt { color:var(--muted); }
dialog.rv-pc-dlg .rv-pcd-facts dd { margin:0; }
dialog.rv-pc-dlg .rv-pcd-facts dd.is-in { color:var(--good, #34d399); font-weight:600; }
dialog.rv-pc-dlg .rv-pcd-buy { display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; margin:0 0 14px; }
dialog.rv-pc-dlg .rv-pcd-qlab { font-size:13px; color:var(--muted); margin:0; text-transform:none; letter-spacing:normal; }
dialog.rv-pc-dlg .rv-pcd-buy .rv-qty { width:76px; }
dialog.rv-pc-dlg .rv-pcd-buy .rv-pcd-add { width:auto; }
dialog.rv-pc-dlg .rv-pcd-msg { flex:1 1 100%; margin:0; font-size:13px; }
dialog.rv-pc-dlg .rv-pcd-msg.is-ok { color:var(--good, #34d399); }
dialog.rv-pc-dlg .rv-pcd-msg.is-err { color:var(--bad, #f87171); }
dialog.rv-pc-dlg .rv-pcd-msg.is-info { color:var(--accent2); }
dialog.rv-pc-dlg .rv-pcd-call { flex:1 1 100%; margin:0; font-size:13px; color:#fbbf24; }
dialog.rv-pc-dlg .rv-pcd-call a { color:inherit; text-decoration:underline; }

/* RULE 35 -- an item that cannot be bought online is a GRAYED-OUT BUTTON that says why in the item's own status word (lib/rv_item_status.php): cards, the Details popup, the cart's wish list.
   One rule here (the cart's own ".rv-c-act .btn.is-off" copy was purged 2026-10-08). */
.rvtheme .btn.rv-btn-status, dialog.rv-dialog .btn.rv-btn-status { background:rgba(148,163,184,.14); border:1px solid rgba(148,163,184,.35); color:#cbd5e1; box-shadow:none; text-shadow:none; animation:none; cursor:not-allowed; opacity:1; transform:none; width:auto; }
.rvtheme .btn.rv-btn-status:hover, .rvtheme .btn.rv-btn-status:focus { background:rgba(148,163,184,.14); box-shadow:none; transform:none; }
.rvtheme .btn.rv-btn-status, dialog.rv-dialog .btn.rv-btn-status { display:inline-flex; align-items:center; justify-content:center; text-align:center; }   /* the label is centered like every other button (Russell 10/8) */
.rvtheme .btn.rv-btn-status.is-info { cursor:pointer; }
.rvtheme .btn.rv-btn-status.is-info:hover, .rvtheme .btn.rv-btn-status.is-info:focus-visible { border-color:var(--accent2); color:var(--accent2); }
.rvtheme .rv-pc-btns .btn.rv-btn-status { flex:1 1 0; min-width:0; white-space:normal; line-height:1.2; padding-left:8px; padding-right:8px; }   /* a long status word ("Sales Distributor Exclusive") wraps beside Details instead of being cut off */
.rvtheme .rv-pc-sub { flex-wrap:wrap; row-gap:4px; }
.rvtheme .rv-pc-img[data-rv-zoom] { cursor:zoom-in; }
/* Ask Question popup (rv_askq.js): chrome only, every color a token */
#rv-askq textarea { width:100%; min-height:110px; box-sizing:border-box; resize:vertical; }
#rv-askq .rv-lead { margin:0 0 12px; }
#rv-askq .rv-dialog-x { z-index:2; }
#rv-askq .hint.met { color:var(--good, #34d399); }
#rv-askq .rv-ask-hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
#rv-askq .rv-ask-msg { margin:12px 0 0; padding:10px 12px; border-radius:10px; font-size:14px; line-height:1.45; border:1px solid var(--bad, #f87171); color:#fca5a5; background:rgba(248,113,113,.10); }
#rv-askq .rv-ask-msg.good { border-color:var(--good, #10b981); color:#a7f3d0; background:rgba(16,185,129,.10); }
#rv-askq .field .err { display:block; margin-top:6px; }

/* RULE 36 -- the re-theme's badges (OEM, Return, Price match; lib/rv_badges.php) small, in a column, on the Details popup */
dialog.rv-pc-dlg .rv-pcd-badges { float:right; display:flex; flex-direction:column; gap:6px; margin:0 0 6px 12px; }
dialog.rv-pc-dlg .rv-pcd-badges a { display:block; line-height:0; }
dialog.rv-pc-dlg .rv-pcd-badges img { display:block; width:56px; height:56px; }
/* an availability that is not "In Stock" (Out of Stock, Discontinued, Limited...) is the theme's cyan, so it is noticed (Russell 10/8) */
dialog.rv-pc-dlg .rv-pcd-facts dd.is-attn { color:var(--accent2); font-weight:700; }
/* the list of parts under ONE diagram number (rv_pdetails.js list()): the old "Product List" popup, re-themed on the same dialog */
dialog.rv-pc-listdlg { width:min(94vw, 780px); }
dialog.rv-pc-listdlg h3 { margin:0 28px 4px 0; font-size:20px; }
dialog.rv-pc-listdlg .rv-pl-lead { margin:0; color:var(--muted); font-size:13px; }
dialog.rv-pc-listdlg .rv-pl { list-style:none; margin:14px 0 0; padding:0; display:grid; gap:12px; max-height:56vh; overflow:auto; }
dialog.rv-pc-listdlg .rv-pl-row { display:grid; grid-template-columns:76px minmax(0,1fr) auto; gap:14px; align-items:center; padding:12px; border:1px solid var(--line2); border-radius:12px; background:rgba(2,6,18,.35); }
dialog.rv-pc-listdlg .rv-pl-img { width:76px; height:76px; padding:0; border:0; background:#fff; border-radius:10px; overflow:hidden; display:flex; align-items:center; justify-content:center; cursor:zoom-in; box-shadow:none; }
dialog.rv-pc-listdlg .rv-pl-img img { width:100%; height:100%; object-fit:contain; display:block; }
dialog.rv-pc-listdlg .rv-pl-name { width:auto; margin:0; padding:0; border:0; background:none; box-shadow:none; color:var(--txt); font:inherit; font-weight:700; text-align:left; text-transform:none; letter-spacing:normal; cursor:pointer; }
dialog.rv-pc-listdlg .rv-pl-name:hover { color:var(--accent2); text-decoration:underline; }
dialog.rv-pc-listdlg .rv-pl-model { margin-top:2px; color:var(--muted); font-size:13px; }
dialog.rv-pc-listdlg .rv-pl-price { margin-top:6px; }
dialog.rv-pc-listdlg .rv-pl-note { color:var(--muted); font-style:italic; }
dialog.rv-pc-listdlg .rv-pl-acts { display:grid; gap:8px; min-width:130px; }
dialog.rv-pc-listdlg .rv-pl-acts .btn { width:auto; justify-content:center; }
dialog.rv-pc-listdlg .rv-pcd-msg { margin:6px 0 0; font-size:13px; }
@media (max-width:640px) { dialog.rv-pc-listdlg .rv-pl-row { grid-template-columns:64px minmax(0,1fr); } dialog.rv-pc-listdlg .rv-pl-img { width:64px; height:64px; } dialog.rv-pc-listdlg .rv-pl-acts { grid-column:1 / -1; grid-template-columns:1fr 1fr; } }
#rv-dist .cardbody p { margin:0 0 12px; line-height:1.55; }
/* card layout (Russell 10/8): the price, buttons and links sit right under the name and stock line on EVERY card; a taller neighbour (a wrapped link, a message) never opens a gap inside a shorter card. Spare height is left under the last row. */
.rvtheme .rv-pcard { justify-content:flex-start; }
/* Compare on a card (Russell 10/8): the arrows badge (tooltip: Compare / Remove from compare) with "View Compare (n)" beside it, on their own line under Remove / Ask Question; the link stays while the list has items */
.rvtheme .rv-pc-cmpgrp { flex:1 1 100%; display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.rvtheme .rv-pc-cmp { width:28px; height:28px; min-width:0; padding:0; margin:0; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:rgba(2,6,18,.45); border:1px solid var(--line2); color:var(--accent2); box-shadow:none; text-shadow:none; cursor:pointer; }
.rvtheme .rv-pc-cmp:hover, .rvtheme .rv-pc-cmp:focus-visible { border-color:var(--accent2); }
.rvtheme .rv-pc-cmp[aria-pressed="true"] { background:rgba(34,211,238,.20); border-color:var(--accent2); }
.rvtheme .rv-pc-cmp svg { display:block; width:16px; height:16px; }
.rvtheme .rv-pc-cmplink { font-size:12.5px; font-weight:600; color:var(--accent2); text-decoration:underline; }
.rvtheme .rv-pc-cmplink[hidden] { display:none; }
/* the "tell me when it is back" popup (rv_notify.js) */
#rv-notify .field .err, #rv-notify .rv-notify-msg { margin:10px 0 0; font-size:14px; line-height:1.45; }
#rv-notify .rv-notify-msg.is-bad { color:#fca5a5; }
#rv-notify .rv-notify-msg.is-good { color:var(--good, #34d399); }
#rv-notify .rv-notify-form .addrbtns { margin-top:14px; }
#rv-notify .cardbody p { margin:0 0 12px; line-height:1.55; }
/* the Ask Question popup's Name and E-Mail boxes 15% wider than the browser's 178 px default (Russell 10/8: longer e-mail addresses and names) */
#rv-askq .field input[type="text"], #rv-askq .field input[type="email"] { width:205px; max-width:100%; box-sizing:border-box; }
#rv-notify .field input[type="text"], #rv-notify .field input[type="email"] { width:100%; box-sizing:border-box; }

/* My Account: the Model / Serial Number card (checkout/ms_card.tpl, 'account' mode) in its own form under the two link cards (2026-10-08, Russell: "place this information on the My Account page") */
.rvtheme.rv-myacct .rv-ma-ms-form { margin:16px 0 0; }
.rvtheme.rv-myacct .rv-ma-ms-form .rv-btnrow { display:flex; flex-wrap:wrap; gap:10px; margin:14px 0 0; }
.rvtheme.rv-myacct .rowmsg { margin:0 0 14px; }

/* card top row (Russell 10/8: "move the whole Compare (badge), Remove (badge), View (compare) all in the top row of the image and get it out of the lower section"): on the photo, compare badge + View Compare (n) on the left, the Remove badge on the right; dark pills so they read on the white photo */
.rvtheme .rv-pc-top { position:absolute; top:8px; left:8px; right:8px; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:6px; pointer-events:none; }
.rvtheme .rv-pc-top > * { pointer-events:auto; }
.rvtheme .rv-pc-top .rv-pc-cmpgrp { flex:0 1 auto; min-width:0; display:inline-flex; align-items:center; justify-content:flex-start; gap:7px; padding:2px; border-radius:999px; background:rgba(15,23,42,.92); border:1px solid var(--line2); }
.rvtheme .rv-pc-top .rv-pc-cmpgrp:has(.rv-pc-cmplink:not([hidden])) { padding-right:10px; }
.rvtheme .rv-pc-top .rv-pc-cmp { flex:0 0 auto; background:transparent; border-color:transparent; }
.rvtheme .rv-pc-top .rv-pc-cmp[aria-pressed="true"] { background:rgba(34,211,238,.24); border-color:var(--accent2); }
.rvtheme .rv-pc-top .rv-pc-cmplink { min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:12px; }
.rvtheme .rv-pc-xbtn { flex:0 0 auto; margin-left:auto; width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:rgba(15,23,42,.92); border:1px solid var(--line2); color:var(--muted); font-size:13px; line-height:1; text-decoration:none; }
.rvtheme .rv-pc-xbtn:hover, .rvtheme .rv-pc-xbtn:focus-visible { color:#fca5a5; border-color:var(--bad); text-decoration:none; }
.rvtheme .rv-pcard:has(.rv-pc-top) .rv-pc-badge { top:46px; }
@media (max-width:560px) { .rvtheme .rv-pc-top { top:5px; left:5px; right:5px; gap:3px; } .rvtheme .rv-pc-top .rv-pc-cmplink { font-size:10px; letter-spacing:0; } .rvtheme .rv-pc-top .rv-pc-cmpgrp { gap:3px; border-width:0; } .rvtheme .rv-pc-top .rv-pc-cmpgrp:has(.rv-pc-cmplink:not([hidden])) { padding-right:5px; } .rvtheme .rv-pc-top .rv-pc-cmp { width:24px; height:24px; } .rvtheme .rv-pc-top .rv-pc-cmp svg { width:14px; height:14px; } .rvtheme .rv-pc-xbtn { width:24px; height:24px; font-size:12px; } .rvtheme .rv-pcard:has(.rv-pc-top) .rv-pc-badge { top:40px; } }
/* the standard X (rv_dialog.js adds it to any popup that lacks one): far top-right corner of the popup, muted, never a bordered box */
dialog.rv-dialog .rv-dialog-x { z-index:3; }
dialog.rv-dialog:not([open]) { display:none; }
/* Magnific popups still on the product page (photo zoom): the same standard X as every dialog instead of the old red corner tab. The old rule is baked into the built common-*.js bundle, so this wins by specificity (magnific-popup.css carries the same rule for when the bundle is rebuilt) */
html body .mfp-content button.mfp-close, html body .mfp-image-holder .mfp-content button.mfp-close, html body .mfp-iframe-holder .mfp-content button.mfp-close { width:34px!important; height:34px!important; line-height:30px; top:8px; right:10px; padding:0; text-align:center; background:rgba(15,23,42,.92); border:1px solid #334155; border-radius:50%; color:#cbd5e1; font-size:22px; font-family:Arial,sans-serif; }
html body .mfp-content button.mfp-close:hover, html body .mfp-content button.mfp-close:focus { color:#fff; border-color:#22d3ee; }

/* the status line on every card: green for In Stock, cyan (like the Details popup's Availability) for anything else (Russell 10/8) */
.rvtheme .rv-pc-stock.is-attn { color:var(--accent2); font-weight:700; }
/* Ask Question in the Details popup: beside the buy / status button, cyan (Russell 10/8) */
dialog.rv-pc-dlg .rv-pcd-buy .btn.rv-pcd-ask { width:auto; background:linear-gradient(180deg,#22d3ee,#0891b2); border-color:#22d3ee; color:#04222b; font-weight:800; text-shadow:none; box-shadow:0 0 0 1px rgba(34,211,238,.25), 0 6px 18px rgba(34,211,238,.22); }
dialog.rv-pc-dlg .rv-pcd-buy .btn.rv-pcd-ask:hover, dialog.rv-pc-dlg .rv-pcd-buy .btn.rv-pcd-ask:focus-visible { filter:brightness(1.12); }
/* a video inside a page popup (rv_dialog.js page(), the OEM page): 16:9, picture + drawn play button, plays in place; does not depend on rv_site.css (a legacy page has none) */
dialog.rv-dialog .rv-dialog-video { position:relative; width:100%; max-width:560px; height:auto; padding:0; aspect-ratio:16 / 9; margin:14px auto; background:#000; border:0; border-radius:12px; overflow:hidden; box-shadow:none; }
dialog.rv-dialog .rv-dialog-video .video-facade { position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0; border:0; border-radius:0; background:#000; cursor:pointer; display:block; overflow:hidden; box-shadow:none; }
dialog.rv-dialog .rv-dialog-video .video-facade img { width:100%; height:100%; max-width:none; border-radius:0; object-fit:cover; display:block; }
dialog.rv-dialog .rv-dialog-video .video-play { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:68px; height:48px; border-radius:14px; background:rgba(0,0,0,.72); transition:background .25s ease; }
dialog.rv-dialog .rv-dialog-video .video-play::after { content:""; position:absolute; top:50%; left:50%; transform:translate(-40%,-50%); border-style:solid; border-width:10px 0 10px 17px; border-color:transparent transparent transparent #fff; }
dialog.rv-dialog .rv-dialog-video .video-facade:hover .video-play, dialog.rv-dialog .rv-dialog-video .video-facade:focus-visible .video-play { background:#2563eb; }
dialog.rv-dialog .rv-dialog-video iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
/* the quantity box keeps its aria-label; its visible word goes so Add to Cart and Ask Question fit on one line beside the badge column */
dialog.rv-pc-dlg .rv-pcd-buy .rv-pcd-qlab { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
dialog.rv-pc-dlg .rv-pcd-buy .btn:not(.rv-btn-status) { padding-left:10px; padding-right:10px; font-size:12px; letter-spacing:.03em; }
dialog.rv-pc-dlg .rv-pcd-buy { gap:8px 6px; }

/* BUTTON COLORS BY ACTION (Russell 10/8; docs/retheme-rules.md rule 44): green = do it / keep it (Add to Cart, Save, Confirm); purple = go look / next (Details, Continue, Show full details); cyan = ask / help; gray = leave / status; amber = sign out; red = remove. */
.rvtheme .btn.rv-go, dialog.rv-dialog .btn.rv-go { background:linear-gradient(135deg,#34d399,#10b981); border-color:transparent; color:#06281d; font-weight:800; text-shadow:none; box-shadow:0 0 0 1px rgba(52,211,153,.25), 0 6px 18px rgba(16,185,129,.28); }
.rvtheme .btn.rv-go:hover, .rvtheme .btn.rv-go:focus-visible, dialog.rv-dialog .btn.rv-go:hover { color:#06281d; filter:brightness(1.08); }
.rvtheme .btn.rv-go[disabled], dialog.rv-dialog .btn.rv-go[disabled] { opacity:.6; cursor:default; filter:none; }
/* card buttons: the buy / status button on the left, Details with Ask Question under it on the right, both starting at the TOP of the left button (no dead space under Details beside a tall status button) */
.rvtheme .rv-pc-btns { align-items:flex-start; }
.rvtheme .rv-pc-act > * { min-width:0; }
.rvtheme .rv-pc-btns > .btn { align-self:flex-start; margin:0 !important; }   /* something upstream gives these buttons auto margins, which centered them vertically */
.rvtheme .rv-pc-btns > .btn.rv-btn-status { font-size:11.5px; letter-spacing:.02em; padding-left:6px; padding-right:6px; overflow-wrap:anywhere; }
.rvtheme .rv-pc-btns .rv-pc-buy { flex:1 1 0; min-width:0; padding-left:8px; padding-right:8px; font-size:12px; letter-spacing:.03em; justify-content:center; }
.rvtheme .rv-pc-btns .rv-pc-side { flex:0 0 100px; width:100px; display:flex; flex-direction:column; align-items:stretch; gap:4px; }
.rvtheme .rv-pc-btns .rv-pc-side .rv-pc-details { width:100%; justify-content:center; padding-left:6px; padding-right:6px; }
.rvtheme .rv-pc-btns .rv-pc-side .rv-pc-link { white-space:nowrap; padding:0; text-align:center; font-size:12px; }
@media (max-width:560px) { .rvtheme .rv-pc-btns .rv-pc-buy { flex:1 1 100%; } .rvtheme .rv-pc-btns .rv-pc-side { flex:1 1 100%; width:auto; } .rvtheme .rv-pc-btns .rv-pc-side .rv-pc-link { padding:4px 0; } }

/* Ask Question with details already given (rv_askq.js, Russell 10/8): details, a red line, then the buyer's own box -- one dark box, about 230 px tall to start so there is plenty of room to type */
#rv-askq .rv-askq-box { border:1px solid var(--line2); border-radius:10px; background:#0a1020; overflow:hidden; }
#rv-askq .rv-askq-box:focus-within { border-color:var(--accent2); }
#rv-askq .rv-askq-details { padding:10px 12px; font-size:14px; line-height:1.5; color:var(--txt); white-space:pre-wrap; overflow-wrap:anywhere; user-select:text; }
#rv-askq .rv-askq-line { height:2px; background:#ef4444; margin:0; }
#rv-askq .rv-askq-box textarea { display:block; border:0; border-radius:0; background:transparent; min-height:140px; box-shadow:none; outline:0; }
#rv-askq .rv-askq-box.required-message { border-color:var(--bad); }
#rv-askq.rv-dialog-card { max-height:94vh; overflow-y:auto; }

/* Order Complete (rv_theme rule 47, 2026-10-08): the hero's buttons sit at the LEFT under the text (Russell: every checkout button in the left corner), for the customer and the staff view; staff upload form */
.rvtheme .rv-ss-btns { display:flex; flex-wrap:wrap; gap:10px; margin:12px 0 0; justify-content:flex-start; }
.rvtheme .rv-ss-btns .btn { width:auto; margin:0; }
.rvtheme .rv-ss-hero h1 a { color:var(--accent2); text-decoration:underline; }
.rvtheme .rv-ss-files { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px; margin:0 0 14px; }
.rvtheme .rv-ss-file { margin:0; padding:12px 14px 4px; border:1px solid var(--line); border-radius:12px; min-width:0; }
.rvtheme .rv-ss-file legend { padding:0 6px; color:var(--muted); font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.rvtheme .rv-ss-file input[type=file] { width:100%; color:var(--txt); }
.rvtheme .rv-ss-upload .rv-btnrow { display:flex; gap:10px; justify-content:flex-start; margin:0; }
.rvtheme .rv-ss-upload .rv-btnrow .btn { width:auto; margin:0; }
@media (max-width:640px) { .rvtheme .rv-ss-files { grid-template-columns:minmax(0,1fr); } .rvtheme .rv-ss-btns .btn { flex:1 1 100%; } }

/* red "No" in a yes/no question (Russell: Yes = green, No = red), the storefront twin of the admin rvYesNo look */
.rvtheme .btn.rv-no, dialog.rv-dialog .btn.rv-no { background:linear-gradient(135deg,#ef4444,#dc2626); border-color:transparent; color:#fff; font-weight:800; text-shadow:none; }
.rvtheme .btn.rv-no:hover, dialog.rv-dialog .btn.rv-no:hover { filter:brightness(1.08); color:#fff; }

/* Compare (product/compare_next.tpl, rule 49) */
.rvtheme.rv-compare .rv-cmp-tools { display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin:0 0 14px; justify-content:flex-start; }
.rvtheme.rv-compare .rv-cmp-diff { display:inline-flex; align-items:center; gap:8px; margin:0; font-size:14px; font-weight:700; color:var(--txt); text-transform:none; letter-spacing:normal; cursor:pointer; }
.rvtheme.rv-compare .rv-cmp-diff input { width:18px; height:18px; margin:0; accent-color:#22d3ee; }
.rvtheme.rv-compare .rv-cmp-clear { width:auto; margin:0; border-color:rgba(248,113,113,.5); color:#fca5a5; }
.rvtheme.rv-compare .rowmsg.info, .rvtheme.rv-compare .rv-cmp-note { margin:0 0 12px; background:rgba(34,211,238,.08); border:1px solid rgba(34,211,238,.35); color:#a5f3fc; }
.rvtheme.rv-compare .rv-cmp-empty { margin:0 0 14px; font-size:15px; }
.rvtheme.rv-compare .rv-btnrow { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-start; } .rvtheme.rv-compare .rv-btnrow .btn { width:auto; margin:0; }
.rvtheme.rv-compare .rv-cmp-wrap { border:1px solid var(--line); border-radius:14px; background:linear-gradient(180deg,rgba(30,41,59,.9),rgba(23,32,50,.9)); }
.rvtheme.rv-compare table.rv-cmp { width:100%; border-collapse:separate; border-spacing:0; table-layout:fixed; font-size:14px; }
.rvtheme.rv-compare .rv-cmp th, .rvtheme.rv-compare .rv-cmp td { padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top; text-align:left; color:var(--txt); background:transparent; }
.rvtheme.rv-compare .rv-cmp .rv-cmp-lab { width:190px; color:var(--muted); font-size:12.5px; font-weight:700; letter-spacing:.02em; }
.rvtheme.rv-compare .rv-cmp thead th { position:sticky; top:0; z-index:3; background:#162036; vertical-align:top; }
.rvtheme.rv-compare .rv-cmp thead th:first-child { border-top-left-radius:14px; } .rvtheme.rv-compare .rv-cmp thead th:last-child { border-top-right-radius:14px; }
.rvtheme.rv-compare .rv-cmp-item { position:relative; }
.rvtheme.rv-compare .rv-cmp-pic { position:relative; width:130px; margin:4px 0 10px; }   /* the picture and its X: the X sits just right of the picture's top-right corner (Russell 10/9 12:39 AM) */
.rvtheme.rv-compare .rv-cmp-pic .rv-cmp-img { margin:0; }
.rvtheme.rv-compare .rv-cmp-pic .rv-cmp-remove { position:absolute; top:0; left:calc(100% + 8px); right:auto; }
/* the card's X is an <a>; here it is a <button>, so the home shell's bare `button` rule (glow, lift, shimmer, upper-case) reached it and it did not look like the themed X. Same X as the card's: 30 px round, dark, muted. */
.rvtheme button.rv-pc-xbtn { padding:0; margin:0; min-width:0; box-shadow:none; animation:none; transform:none; text-transform:none; letter-spacing:normal; overflow:visible; cursor:pointer; font-family:inherit; font-weight:400; }
.rvtheme button.rv-pc-xbtn::before, .rvtheme button.rv-pc-xbtn::after { content:none; display:none; }
.rvtheme button.rv-pc-xbtn:hover, .rvtheme button.rv-pc-xbtn:focus-visible { transform:none; box-shadow:none; }
.rvtheme.rv-compare .rv-cmp-img { display:block; width:130px; height:130px; margin:4px 0 10px; border-radius:10px; background:#fff; overflow:hidden; }
.rvtheme.rv-compare .rv-cmp-img img { width:100%; height:100%; object-fit:contain; display:block; }
.rvtheme.rv-compare .rv-cmp-name { display:block; color:var(--txt); font-size:15px; font-weight:800; line-height:1.3; margin:0 0 6px; text-decoration:none; }
.rvtheme.rv-compare .rv-cmp-name:hover { color:var(--accent2); text-decoration:underline; }
.rvtheme.rv-compare .rv-cmp-price { font-size:16px; font-weight:800; margin:0 0 10px; white-space:nowrap; } .rvtheme.rv-compare .rv-cmp-price .rv-pc-was { font-size:12px; }   /* smaller, and no "USD" (10/8 8:03 PM) so a sale price (was + now) stays on ONE line */
.rvtheme.rv-compare .rv-cmp-rate { margin:0 0 8px; }
.rvtheme.rv-compare .rv-cmp-btns { display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
.rvtheme.rv-compare .rv-cmp-btns .btn { width:auto; min-width:130px; margin:0; justify-content:center; padding:9px 14px; font-size:12.5px; }
.rvtheme.rv-compare .rv-cmp-btns .rv-btn-status { white-space:normal; line-height:1.2; }
.rvtheme.rv-compare .rv-cmp-ask { padding:2px 0; }
.rvtheme.rv-compare .rv-cmp-msg { margin:8px 0 0; font-size:12.5px; font-weight:400; } .rvtheme.rv-compare .rv-cmp-msg.is-ok { color:var(--good); } .rvtheme.rv-compare .rv-cmp-msg.is-err { color:var(--bad); } .rvtheme.rv-compare .rv-cmp-msg.is-info { color:var(--accent2); }
.rvtheme.rv-compare .rv-cmp-count { color:var(--muted); font-size:12px; font-weight:700; }
.rvtheme.rv-compare .rv-cmp-sec th { padding:14px 12px 8px; background:rgba(99,102,241,.10); color:var(--accent2); font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.rvtheme.rv-compare .rv-cmp-none { color:var(--faint, #64748b); font-style:italic; font-size:12.5px; }
.rvtheme.rv-compare .rv-cmp-ok { color:var(--good); font-weight:700; } .rvtheme.rv-compare .rv-cmp-attn { color:var(--accent2); font-weight:700; }
.rvtheme.rv-compare .rv-cmp-yes { color:var(--good); font-size:18px; font-weight:800; } .rvtheme.rv-compare .rv-cmp-no { color:var(--faint, #64748b); }
.rvtheme.rv-compare .rv-cmp-chip { display:inline-block; margin:0 6px 6px 0; padding:3px 10px; border-radius:999px; background:rgba(52,211,153,.14); border:1px solid rgba(52,211,153,.45); color:#a7f3d0; font-size:12px; font-weight:800; }
.rvtheme.rv-compare .rv-cmp tr.is-diff td { background:rgba(34,211,238,.035); }
.rvtheme.rv-compare table.only-diff tr.is-same { display:none; }
@media (max-width:760px) {
	.rvtheme.rv-compare .rv-cmp-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
	.rvtheme.rv-compare table.rv-cmp { width:auto; min-width:100%; table-layout:auto; }
	.rvtheme.rv-compare .rv-cmp th, .rvtheme.rv-compare .rv-cmp td { min-width:150px; padding:9px 10px; }
	.rvtheme.rv-compare .rv-cmp .rv-cmp-lab { position:sticky; left:0; z-index:2; width:110px; min-width:110px; background:#162036; }
	.rvtheme.rv-compare .rv-cmp thead th { position:static; }
	.rvtheme.rv-compare .rv-cmp tr > :nth-child(5) { display:none; }   /* 3 items on a phone (Russell); the 4th shows on a wider screen */
	.rvtheme.rv-compare .rv-cmp-img { width:96px; height:96px; }
	.rvtheme.rv-compare .rv-cmp-pic { width:96px; }
	.rvtheme.rv-compare .rv-cmp-btns .btn { min-width:0; width:100%; }
}
/* Compare in the Details popup (Q9) */
dialog.rv-pc-dlg .rv-pcd-acts { align-items:center; }
dialog.rv-pc-dlg .rv-pcd-cmp[aria-pressed="true"] { border-color:var(--accent2); color:var(--accent2); }
dialog.rv-pc-dlg .rv-pcd-cmplink { color:var(--accent2); font-weight:700; font-size:13px; text-decoration:underline; }
/* Compare 10/8 later: the picture is a button (larger picture popup), a ratings line on every item, names in normal case */
.rvtheme.rv-compare .rv-cmp thead th { text-transform:none; letter-spacing:normal; }
.rvtheme.rv-compare button.rv-cmp-img { padding:0; border:0; cursor:zoom-in; box-shadow:none; }
.rvtheme.rv-compare .rv-cmp-rate { display:flex; align-items:center; flex-wrap:wrap; gap:6px; min-height:22px; }
.rvtheme.rv-compare .rv-cmp-revlink, dialog.rv-pc-dlg .rv-pcd-rev { width:auto; margin:0; padding:0; border:0; background:none; box-shadow:none; color:var(--accent2); font:inherit; font-size:12.5px; font-weight:600; text-transform:none; letter-spacing:normal; text-decoration:underline; cursor:pointer; }
dialog.rv-pc-dlg .rv-pcd-rev[disabled] { color:var(--muted); text-decoration:none; cursor:default; }
.rvtheme.rv-compare .rv-cmp-norev { color:var(--muted); font-size:12.5px; }
.rvtheme.rv-compare .rv-cmp-rate .rv-stars .e { opacity:.5; }
/* the reviews popup (rvDetails.reviews) */
dialog.rv-rev-dlg .rv-rev-title { margin:0 36px 8px 0; font-size:18px; }
dialog.rv-rev-dlg .rv-rev-sum { display:flex; align-items:center; gap:8px; margin:0 0 12px; color:var(--muted); font-size:14px; }
dialog.rv-rev-dlg .rv-rev-list { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
dialog.rv-rev-dlg .rv-rev { padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:rgba(2,6,18,.25); }
dialog.rv-rev-dlg .rv-rev-head { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0 0 6px; }
dialog.rv-rev-dlg .rv-rev-date { color:var(--muted); font-size:12.5px; }
dialog.rv-rev-dlg .rv-rev-text { margin:0; white-space:pre-wrap; line-height:1.55; }
dialog.rv-rev-dlg .rv-rev-more { display:inline-block; margin-top:12px; color:var(--accent2); font-weight:700; }
.rvtheme.rv-compare .rv-cmp-name { min-height:2.6em; }   /* two lines kept for every name, so price / rating / buttons start at the same height in every column */
.rvtheme.rv-compare .rv-cmp-price { min-height:22px; }

/* Compare 10/8 evening (Russell): names smaller and cut at two lines (the whole name on hover, title=); row labels always wrap, never run under the first column;
   What's included is one line per kind of piece, each column's version a link to that piece's Details (lib/rv_compare.php rv_cmp_group_included). */
.rvtheme.rv-compare .rv-cmp-name { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden; font-size:13.5px; line-height:1.3; min-height:2.6em; overflow-wrap:anywhere; }
.rvtheme.rv-compare .rv-cmp tbody .rv-cmp-lab { white-space:normal; overflow-wrap:anywhere; text-transform:none; }
.rvtheme.rv-compare .rv-cmp-inc { display:block; width:auto; margin:0 0 4px; padding:0; border:0; background:none; box-shadow:none; color:var(--txt); font:inherit; font-size:13.5px; line-height:1.35;
  text-align:left; text-transform:none; letter-spacing:normal; overflow-wrap:anywhere; }
.rvtheme.rv-compare .rv-cmp-inc:last-child { margin-bottom:0; }
.rvtheme.rv-compare button.rv-cmp-inc { color:var(--accent2); text-decoration:underline; text-underline-offset:2px; cursor:pointer; }
.rvtheme.rv-compare button.rv-cmp-inc:hover { filter:brightness(1.15); }
.rvtheme.rv-compare .rv-cmp-inc .rv-cmp-yes { display:inline-block; margin-right:2px; text-decoration:none; }
/* Compare 10/8 5:30 PM (Russell: "very end of each hotlink text looks cutoff"): the theme's base button rule has overflow:hidden, and a shrink-wrapped button is a fractional
   width (48.59px) that clips the last pixel of its text. Links styled as buttons must never clip. */
.rvtheme.rv-compare .rv-cmp-inc, .rvtheme.rv-compare .rv-cmp-revlink, .rvtheme.rv-compare button.rv-cmp-img, dialog.rv-pc-dlg .rv-pcd-rev { overflow:visible; }
.rvtheme.rv-compare .rv-cmp-inc, .rvtheme.rv-compare .rv-cmp-revlink { padding-right:2px; }
/* Compare 10/8 5:35 PM (Russell: moving blurred bands left of each picture and down the table): the theme's buttons carry a white "shine" sweep (::before, 130px wide at left:-130px)
   that overflow:hidden normally hides. The 5:30 PM overflow:visible fix for clipped link text let it show. A button drawn as a link or a picture has no shine and no shimmer. */
.rvtheme.rv-compare .rv-cmp-inc::before, .rvtheme.rv-compare .rv-cmp-inc::after, .rvtheme.rv-compare .rv-cmp-revlink::before, .rvtheme.rv-compare .rv-cmp-revlink::after,
.rvtheme.rv-compare button.rv-cmp-img::before, .rvtheme.rv-compare button.rv-cmp-img::after, dialog.rv-pc-dlg .rv-pcd-rev::before, dialog.rv-pc-dlg .rv-pcd-rev::after { content:none; display:none; }
.rvtheme.rv-compare .rv-cmp-inc, .rvtheme.rv-compare .rv-cmp-revlink, .rvtheme.rv-compare button.rv-cmp-img, dialog.rv-pc-dlg .rv-pcd-rev { animation:none; transform:none; }
/* Made in USA badge (key "Made in USA", Russell 10/8): in the Details popup column it keeps its own proportions (the others are square); on the product page it sits by the price and first in the trust row, no link (no page behind it) */
dialog.rv-pc-dlg .rv-pcd-badges img.rv-b-usa { width:48px; height:56px; }
dialog.rv-pc-dlg .rv-pcd-badges > span { display:block; line-height:0; }
.rv-usa-price { display:inline-block; vertical-align:top; margin-right:8px; line-height:0; }
.rv-usa-row { display:inline-block; vertical-align:middle; margin-right:10px; line-height:0; }
.rv-usa-price img, .rv-usa-row img { display:inline-block; height:auto; }
/* Compare 10/8 6:20 PM (Russell: "if something is the same on all three it just states it in the middle, and lines carry out to the left and right"): a row identical for every item is ONE cell across all
   the item columns, the value centered with a line fading out on each side. Built in compare_next.tpl ($rvRow). */
.rvtheme.rv-compare .rv-cmp td.rv-cmp-allsame { text-align:center; }
.rvtheme.rv-compare .rv-cmp-same { display:flex; align-items:center; gap:16px; }
.rvtheme.rv-compare .rv-cmp-same::before, .rvtheme.rv-compare .rv-cmp-same::after { content:""; flex:1 1 0; min-width:16px; height:1px; }
.rvtheme.rv-compare .rv-cmp-same::before { background:linear-gradient(90deg, rgba(148,163,184,0), rgba(148,163,184,.5)); }
.rvtheme.rv-compare .rv-cmp-same::after { background:linear-gradient(90deg, rgba(148,163,184,.5), rgba(148,163,184,0)); }
.rvtheme.rv-compare .rv-cmp-same-v { flex:0 1 auto; max-width:70%; text-align:center; }
.rvtheme.rv-compare .rv-cmp-same-v .rv-cmp-inc { display:inline-block; margin:0 6px; }
@media (max-width:760px) {   /* the item columns scroll sideways on a phone: keep the value in view beside the pinned label instead of centered across the whole scroll width */
	.rvtheme.rv-compare .rv-cmp-same { position:sticky; left:118px; width:calc(100vw - 150px); }
}

/* ===== SEARCH (the re-themed results page, key "Search"; ticket 2026-10-03_14-52-21_Russell, 2026-10-08: "retheme that page next") ===== */
.rv-shell-main .rvtheme.rv-search { background:none; padding:0; display:grid; gap:16px; max-width:1100px; }
.rvtheme.rv-search .rv-sr-count { margin:0; font-size:14px; color:var(--muted); }
.rvtheme.rv-search .rv-sr-note { margin:0; padding:10px 14px; border:1px solid var(--line2); border-left:4px solid var(--accent2); border-radius:12px; background:rgba(34,211,238,.07); line-height:1.5; }
.rvtheme.rv-search .rv-sr-note a { color:var(--accent2); font-weight:700; }
.rvtheme.rv-search .rv-sr-cat .cardbody { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.rvtheme.rv-search .rv-sr-cat img { width:64px; height:64px; object-fit:cover; border-radius:10px; background:#fff; }
.rvtheme.rv-search .rv-sr-cat h2 { margin:0; font-size:18px; flex:1 1 200px; } .rvtheme.rv-search .rv-sr-cat h2 a { color:var(--txt); text-decoration:none; }
.rvtheme.rv-search .rv-sr-foot { display:flex; flex-direction:column; align-items:center; gap:12px; margin:6px 0 4px; }
.rvtheme.rv-search .rv-sr-loading { margin:0; color:var(--muted); font-size:14px; } .rvtheme.rv-search .rv-sr-loading.is-err { color:var(--bad); }
.rvtheme.rv-search .rv-sr-pager { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; }
.rvtheme.rv-search .rv-sr-pager a, .rvtheme.rv-search .rv-sr-pager .is-here, .rvtheme.rv-search .rv-sr-pager .rv-sr-gap { min-width:38px; padding:8px 12px; text-align:center; border:1px solid var(--line2); border-radius:10px; color:var(--txt); text-decoration:none; font-weight:700; font-size:14px; }
.rvtheme.rv-search .rv-sr-pager a:hover { border-color:var(--accent2); color:var(--accent2); }
.rvtheme.rv-search .rv-sr-pager .is-here { background:var(--accent-ink); border-color:transparent; color:#fff; } .rvtheme.rv-search .rv-sr-pager .rv-sr-gap { border-color:transparent; color:var(--muted); }
/* nothing matched */
.rvtheme.rv-search .rv-sr-empty h2 { margin:0 0 10px; font-size:20px; } .rvtheme.rv-search .rv-sr-empty h3, .rvtheme.rv-search .rv-tp h2 { margin:18px 0 10px; font-size:16px; } .rvtheme.rv-search .rv-tp h2 { margin-top:0; font-size:18px; }
.rvtheme.rv-search .rv-sr-tips { margin:0 0 12px 18px; padding:0; line-height:1.7; }
.rvtheme.rv-search .rv-mp { display:flex; flex-wrap:wrap; gap:10px; align-items:stretch; }
.rvtheme.rv-search .rv-mp a { text-decoration:none; color:var(--txt); }
.rvtheme.rv-search .rv-mp-card { display:flex; flex-direction:column; align-items:center; width:132px; padding:8px 6px; border:1px solid var(--line2); border-radius:12px; background:rgba(30,41,59,.6); }
.rvtheme.rv-search .rv-mp-card:hover { border-color:var(--accent2); box-shadow:0 0 0 1px var(--accent2) inset; }
.rvtheme.rv-search .rv-mp-card img { display:block; max-width:100%; height:96px; width:auto; margin:0 auto 6px; border-radius:8px; background:#fff; } .rvtheme.rv-search .rv-mp-noimg { height:96px; }
.rvtheme.rv-search .rv-mp-name { font-weight:700; font-size:14px; line-height:1.2; text-align:center; }
.rvtheme.rv-search .rv-mp-group { padding:8px 8px 6px; border:1px solid var(--line2); border-radius:12px; background:rgba(15,23,41,.5); }
.rvtheme.rv-search .rv-mp-group-title { display:block; margin:0 0 8px; padding-bottom:5px; border-bottom:1px solid var(--line); text-align:center; font-weight:800; font-size:14px; }
.rvtheme.rv-search .rv-mp-kids { display:flex; flex-wrap:wrap; gap:8px; } .rvtheme.rv-search .rv-mp-kids .rv-mp-card { width:118px; } .rvtheme.rv-search .rv-mp-kids .rv-mp-card img, .rvtheme.rv-search .rv-mp-kids .rv-mp-noimg { height:84px; }
/* the picture form */
.rvtheme.rv-search .rv-tp { max-width:680px; } .rvtheme.rv-search .rv-tp-sub, .rvtheme.rv-search .rv-tp-hint { margin:0 0 10px; color:var(--muted); font-size:13px; } .rvtheme.rv-search .rv-tp-opt { color:var(--muted); font-weight:400; }
.rvtheme.rv-search .rv-tp .field { margin:0 0 12px; } .rvtheme.rv-search .rv-tp input[type=email] { max-width:340px; width:100%; } .rvtheme.rv-search .rv-tp select { max-width:340px; width:100%; }
.rvtheme.rv-search .rv-tp-files { list-style:none; margin:6px 0 0; padding:0; display:grid; gap:4px; } .rvtheme.rv-search .rv-tp-files li { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 10px; border:1px solid var(--line); border-radius:8px; font-size:13px; } .rvtheme.rv-search .rv-tp-files li.is-warn { color:var(--bad); border-color:var(--bad); }
.rvtheme.rv-search .rv-tp-x { width:auto; min-height:0; margin:0; padding:2px 8px; border:0; background:none; box-shadow:none; color:var(--bad); font-weight:800; cursor:pointer; overflow:visible; animation:none; } .rvtheme.rv-search .rv-tp-x::before, .rvtheme.rv-search .rv-tp-x::after { content:none; display:none; }
.rvtheme.rv-search .rv-tp-hp { position:absolute; left:-9999px; top:-9999px; height:0; overflow:hidden; }
.rvtheme.rv-search .rv-tp-msg { margin:0 0 10px; padding:10px 14px; border-radius:10px; font-size:14px; line-height:1.5; } .rvtheme.rv-search .rv-tp-msg.is-ok { border:1px solid var(--good); background:rgba(52,211,153,.10); } .rvtheme.rv-search .rv-tp-msg.is-bad { border:1px solid var(--bad); background:rgba(248,113,113,.10); }
.rvtheme.rv-search .rv-sr-btns { display:flex; gap:10px; }
/* extra card lines the search page uses (product/rv_pcard.tpl optional keys) */
.rvtheme .rv-pc-howto { margin:4px 0 2px; padding:3px 8px; border:1px solid var(--accent2); border-radius:8px; font-size:12px; line-height:1.35; color:var(--txt); background:rgba(34,211,238,.08); }
.rvtheme .rv-pc-sub .rv-pc-alt, .rvtheme .rv-pc-sub .rv-pc-edit { display:inline-block; margin-left:10px; color:var(--accent2); font-size:13px; font-weight:700; text-decoration:underline; }
.rvtheme .rv-pc-sub .rv-pc-edit { color:var(--warn); }
.rvtheme .rv-pcard .affirm-listing-row { margin:6px 0 0 !important; }
@media (max-width:640px) { .rvtheme.rv-search .rv-mp-card { width:104px; } .rvtheme.rv-search .rv-mp-card img, .rvtheme.rv-search .rv-mp-noimg { height:74px; } .rvtheme.rv-search .rv-mp-kids .rv-mp-card { width:96px; } .rvtheme.rv-search .rv-mp-kids .rv-mp-card img, .rvtheme.rv-search .rv-mp-kids .rv-mp-noimg { height:66px; } }
/* cards in one row line up: the body takes the spare height, so every card's buttons sit on the same line however many lines the card above them has (search page 2026-10-08) */
.rvtheme .rv-pgrid .rv-pcard .rv-pc-body { flex:1 1 auto; }
.rvtheme.rv-search .rv-sr-btns .btn, .rvtheme.rv-search .rv-sr-foot > .btn { width:auto; min-width:200px; }

/* ===== the card's two groups + the WIDE-ROW list layout (search page, 2026-10-08; Russell: "the four per row really do not line up nicely ... images are small") =====
   .rv-pc-info = name, item number, stars, status, description, how-to note; .rv-pc-buyinfo = price + Affirm. In the grid card they stack exactly as before (the same 6px rhythm; an empty group takes no room). */
.rvtheme .rv-pc-info, .rvtheme .rv-pc-buyinfo { display:flex; flex-direction:column; gap:6px; min-width:0; }
.rvtheme .rv-pc-buyinfo:not(:has(*)) { display:none; }
/* one wide row per item: picture | name, number, stars, status, description | price, Affirm, buttons. Everything lines up down the page because every row has the same three columns. */
.rvtheme .rv-pgrid.is-list { grid-template-columns:1fr; gap:12px; }
.rvtheme .rv-pgrid.is-list .rv-pcard { display:grid; grid-template-columns:220px minmax(0,1fr) 270px; grid-template-rows:auto 1fr; column-gap:20px; align-items:start; }
.rvtheme .rv-pgrid.is-list .rv-pc-img { grid-column:1; grid-row:1 / span 2; width:220px; height:100%; min-height:220px; aspect-ratio:auto; align-self:stretch; }
.rvtheme .rv-pgrid.is-list .rv-pc-img img { max-width:200px; max-height:200px; }
.rvtheme .rv-pgrid.is-list .rv-pc-body { display:contents; }
.rvtheme .rv-pgrid.is-list .rv-pc-info { grid-column:2; grid-row:1 / span 2; padding:16px 0 14px; gap:7px; }
.rvtheme .rv-pgrid.is-list .rv-pc-name { font-size:17px; }
.rvtheme .rv-pgrid.is-list .rv-pc-desc { -webkit-line-clamp:4; font-size:13.5px; }
.rvtheme .rv-pgrid.is-list .rv-pc-buyinfo { grid-column:3; grid-row:1; padding:16px 16px 0 0; }
.rvtheme .rv-pgrid.is-list .rv-pc-price .rv-pc-now { font-size:22px; }
.rvtheme .rv-pgrid.is-list .rv-pc-act { grid-column:3; grid-row:2; align-self:end; padding:10px 16px 16px 0; }
.rvtheme .rv-pgrid.is-list .rv-pc-howto { align-self:flex-start; }
@media (max-width:980px) { .rvtheme .rv-pgrid.is-list .rv-pcard { grid-template-columns:170px minmax(0,1fr) 230px; column-gap:14px; } .rvtheme .rv-pgrid.is-list .rv-pc-img { width:170px; min-height:170px; } .rvtheme .rv-pgrid.is-list .rv-pc-img img { max-width:150px; max-height:150px; } }
@media (max-width:700px) {   /* a phone: picture and words side by side, then the price and buttons across the full width */
	.rvtheme .rv-pgrid.is-list .rv-pcard { grid-template-columns:112px minmax(0,1fr); grid-template-rows:auto auto auto; column-gap:12px; }
	.rvtheme .rv-pgrid.is-list .rv-pc-img { grid-column:1; grid-row:1; width:112px; height:112px; min-height:0; align-self:start; }
	.rvtheme .rv-pgrid.is-list .rv-pc-img img { max-width:104px; max-height:104px; }
	.rvtheme .rv-pgrid.is-list .rv-pc-info { grid-column:2; grid-row:1; padding:12px 12px 4px 0; }
	.rvtheme .rv-pgrid.is-list .rv-pc-buyinfo { grid-column:1 / -1; grid-row:2; padding:4px 12px 0; }
	.rvtheme .rv-pgrid.is-list .rv-pc-act { grid-column:1 / -1; grid-row:3; align-self:start; padding:8px 12px 14px; }
	.rvtheme .rv-pgrid.is-list .rv-pc-name { font-size:15px; }
}
@media (max-width:760px) { .rvtheme.rv-compare .rv-cmp-price { white-space:normal; } }
.rvtheme.rv-compare td .rv-cmp-rate { margin:0; }   /* the rating now sits in a Basics cell */
.rvtheme .rv-pcard .affirm-as-low-as, .rvtheme .rv-pcard .affirm-as-low-as .affirm-modal-trigger { color:var(--txt); } .rvtheme .rv-pcard .affirm-as-low-as .__affirm-logo { color:#fff !important; }   /* Affirm's line on a dark card: white logo, light words (10/8) */
.rvtheme.rv-compare td .rv-cmp-rate { flex-direction:column; align-items:flex-start; gap:3px; }   /* stars, then the reviews link under them, the same on every item */

/* ===== currency picker (rv_currency.js, the shared nav; 2026-10-08) ===== */
dialog.rv-cur-dlg { width:min(92vw, 520px); }
dialog.rv-cur-dlg .rv-cur-title { margin:0 36px 6px 0; font-size:20px; }
dialog.rv-cur-dlg .rv-cur-sub { margin:0 0 12px; color:var(--muted); font-size:13px; line-height:1.5; }
dialog.rv-cur-dlg .rv-cur-q { width:100%; margin:0 0 10px; }
dialog.rv-cur-dlg .rv-cur-list { display:grid; gap:6px; max-height:52vh; overflow-y:auto; padding-right:4px; }
dialog.rv-cur-dlg .rv-cur-opt { display:flex; align-items:center; gap:12px; width:100%; margin:0; padding:9px 12px; border:1px solid var(--line2); border-radius:10px; background:rgba(30,41,59,.6); color:var(--txt); text-align:left; font:600 14px/1.3 sans-serif; font-family:inherit; text-transform:none; letter-spacing:normal; box-shadow:none; cursor:pointer; overflow:visible; animation:none; }
dialog.rv-cur-dlg .rv-cur-opt::before, dialog.rv-cur-dlg .rv-cur-opt::after { content:none; display:none; }
dialog.rv-cur-dlg .rv-cur-opt:hover, dialog.rv-cur-dlg .rv-cur-opt:focus-visible { border-color:var(--accent2); }
dialog.rv-cur-dlg .rv-cur-opt.is-here { border-color:var(--good); background:rgba(52,211,153,.12); }
dialog.rv-cur-dlg .rv-cur-code { flex:0 0 46px; font-weight:800; color:var(--accent2); }
dialog.rv-cur-dlg .rv-cur-name { flex:1 1 auto; min-width:0; }
dialog.rv-cur-dlg .rv-cur-opt[hidden] { display:none; }
/* Compare 10/8 10:16 PM (Russell: "the top that shows the items is being cut off ... it should show everything from the image down"): the item header is frozen (sticky, top:0) but the site nav is sticky too
   (174 px, z-index 1000) and sat ON TOP of it, hiding the picture, name and price and leaving only the buttons. On the desktop Compare page the nav scrolls away with the page, so the whole frozen header
   (picture down to Ask Question) stays in view; a signed-in staff member's fixed 30 px bar is cleared. On a phone the table header is not frozen, so nothing changes there. */
@media (min-width:761px) {
	body:has(.rvtheme.rv-compare) nav.navbar { position:relative; top:0 !important; }   /* the staff bar adds an inline `nav.navbar{top:30px !important}` (to sit under the bar); on a relative nav that 30px pushed the nav DOWN over the breadcrumb (Russell 10/9 1:24 AM). Body padding already clears the bar. */   /* relative, not static: keeps the nav's z-index (1000), so its search dropdown stays ABOVE the frozen table header (Russell 10/9 12:11 AM) */
	body:has(.rvtheme.rv-compare):has(#rv-staffbar) .rvtheme.rv-compare .rv-cmp thead th { top:30px; }
}
/* "Load More..." buttons (search results, reviews; Russell 10/9 12:35 AM: "change button wording to Load More... and center it in the button"): the theme button is a flex box 200 px wide with its content at the
   start, so a short label sat left of center. Same wording, same centering on both. */
#rv-sr-more, #rv-rev-more { justify-content:center; text-align:center; }
/* Compare 10/9 1:00 AM (Russell: "in a case of two items, why don't we place them in the center together, and then 3 and 4 would just fill out the page ... the images look more in line with the data below it"):
   one or two items get a table just wide enough for them (190 px label column + 340 px per item) and sit centered; three and four fill the page as before. Desktop only: on a phone the columns scroll sideways. */
@media (min-width:761px) {
	.rvtheme.rv-compare .rv-cmp-wrap.rv-cmp-n1 { max-width:530px; margin-left:auto; margin-right:auto; }
	.rvtheme.rv-compare .rv-cmp-wrap.rv-cmp-n2 { max-width:870px; margin-left:auto; margin-right:auto; }
}
/* Compare 10/9 1:30 AM (Russell pointed at the empty box under "N items"): "Show only the differences" and Clear all live in the table's corner cell, which is part of the frozen header, so they stay in view and the page has no extra row above the table. */
.rvtheme.rv-compare .rv-cmp-corner .rv-cmp-tools { display:flex; flex-direction:column; align-items:flex-start; flex-wrap:nowrap; gap:10px; margin:10px 0 0; }
.rvtheme.rv-compare .rv-cmp-corner .rv-cmp-diff { align-items:flex-start; font-size:12.5px; line-height:1.3; white-space:normal; }
.rvtheme.rv-compare .rv-cmp-corner .rv-cmp-clear { min-width:0; padding:6px 14px; font-size:12px; }
/* Reviews "Load More..." is the same width as the search page's (Russell 10/9, Q8 yes). */
#rv-rev-more { min-width:200px; }
/* ORDER STATUS (module/order_status_next.tpl + order_status_result.tpl, key "Order Status", ticket 2026-10-03_14-52-21_Russell, 2026-10-09, Russell: "this page needs a full RE-THEMED process"): one narrow column,
   the lookup card, then the answer card (status word, the five-step bar, the sentence, the carrier's last scan, the delivery map, the tracking table). The tracking table stacks on a phone. */
.rvtheme.rv-os { max-width:680px; margin:0 auto; }
.rvtheme.rv-os .rv-os-lead { color:var(--muted); margin:0 0 16px; }
.rvtheme.rv-os .rv-os-opt { color:var(--muted); font-weight:400; font-size:12px; }
.rvtheme.rv-os .rv-os-btns { margin-top:6px; }
.rvtheme.rv-os #rv-os-form[hidden], .rvtheme.rv-os #rv-os-err[hidden] { display:none; }
.rvtheme.rv-os .rv-os-card h2 { margin:0 0 6px; font-size:22px; }
.rvtheme.rv-os .rv-os-card h2:focus { outline:none; }
.rvtheme.rv-os .rv-os-word { color:var(--accent2); }
.rvtheme.rv-os .rv-os-msg { margin:14px 0 0; }
.rvtheme.rv-os .rv-os-msg p { margin:0 0 10px; line-height:1.55; }
.rvtheme.rv-os .rv-os-msg.is-strong p { font-weight:700; }
.rvtheme.rv-os .rv-os-msg mark { background:#facc15; color:#1f1500; padding:0 5px; border-radius:4px; }
.rvtheme.rv-os .rowmsg { margin:14px 0 0; }
.rvtheme.rv-os .rv-os-map { display:block; margin:16px 0 0; width:100%; max-width:400px; height:auto; border:1px solid var(--line); border-radius:10px; }
.rvtheme.rv-os .rv-os-sub { margin:22px 0 8px; font-size:16px; }
.rvtheme.rv-os .rv-os-trkwrap { overflow-x:auto; }
.rvtheme.rv-os table.rv-os-trk { width:100%; border-collapse:collapse; font-size:14px; }
.rvtheme.rv-os table.rv-os-trk th, .rvtheme.rv-os table.rv-os-trk td { padding:9px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.rvtheme.rv-os table.rv-os-trk th { color:var(--muted); font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.rvtheme.rv-os table.rv-os-trk a { color:var(--accent2); }
.rvtheme.rv-os .rv-os-actions { margin-top:20px; }
@media (max-width:560px) {
	.rvtheme.rv-os table.rv-os-trk thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
	.rvtheme.rv-os table.rv-os-trk td { display:flex; justify-content:space-between; gap:12px; border-bottom:0; padding:6px 2px; }
	.rvtheme.rv-os table.rv-os-trk td::before { content:attr(data-label); color:var(--muted); font-size:12px; font-weight:700; }
	.rvtheme.rv-os table.rv-os-trk tr { display:block; border-bottom:1px solid var(--line); padding:6px 0; }
}
/* Order Status tracking table (Russell 10/9 3:24 AM: "not all the fonts are same"): the base theme's `table tr:first-child td` dresses the FIRST row of any table as a header (11px, bold, upper-case,
   muted, dark box). This table has a real <thead>, so its first tracking number is a body row like the others. */
.rvtheme.rv-os table.rv-os-trk tbody tr:first-child td { font-size:14px; font-weight:400; letter-spacing:normal; text-transform:none; color:var(--txt); background:transparent; }
/* the carrier line and the Delivered line in the answer read in the page's own body text (14px, regular; only the place and the dates are bold), not the small semibold message style */
.rvtheme.rv-os .rv-os-card .rowmsg { font-size:14px; font-weight:400; line-height:1.55; }
.rvtheme.rv-os .rv-os-card .rowmsg strong { font-weight:700; }
/* CATEGORY PAGES (product/category_next.tpl, key "Category Pages", ticket 2026-10-03_14-52-21_Russell, 2026-10-09: Manuals, Fragrances, Accessories / Attachments). The page wears the search page's
   classes (rvtheme rv-search: the shared cards in wide rows, the summary line, the "Load More..." foot, the page links) plus these: the review summary, the description card (the store's own HTML,
   kept readable on the dark card), the subcategory tiles (picture, name, count, View Items: a tile opens its category). Text is the page's standard 14px. */
.rv-shell-main h1 .rv-cat-pg { color:var(--muted, #94a3b8); font-weight:600; font-size:.7em; }
.rvtheme.rv-cat .rv-cat-staff { margin:0; } .rvtheme.rv-cat .rv-cat-staff a { color:#facc15; font-weight:700; font-size:13px; }
.rvtheme.rv-cat .rv-cat-rate { margin:0; display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:14px; color:var(--muted); } .rvtheme.rv-cat .rv-cat-rate strong { color:var(--txt); }
.rvtheme.rv-cat .rv-cat-pdf { margin:0; display:flex; gap:12px; flex-wrap:wrap; } .rvtheme.rv-cat .rv-cat-pdf a { color:var(--accent2); font-weight:700; font-size:14px; }
.rvtheme.rv-cat .rv-cat-about .cardbody { display:flex; flex-wrap:wrap; gap:16px 22px; align-items:flex-start; }
.rvtheme.rv-cat .rv-cat-photos { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:12px; }
.rvtheme.rv-cat .rv-cat-photos li { width:150px; text-align:center; font-size:12px; color:var(--muted); }
.rvtheme.rv-cat .rv-cat-photos img { display:block; width:150px; height:150px; object-fit:contain; background:#fff; border-radius:10px; margin:0 0 4px; }
.rvtheme.rv-cat .rv-cat-desc { flex:1 1 320px; min-width:0; font-size:14px; line-height:1.6; color:var(--txt); }
.rvtheme.rv-cat .rv-cat-desc p { margin:0 0 10px; } .rvtheme.rv-cat .rv-cat-desc p:last-child { margin-bottom:0; }
.rvtheme.rv-cat .rv-cat-desc h2, .rvtheme.rv-cat .rv-cat-desc h3 { margin:14px 0 8px; font-size:17px; color:var(--txt); }
.rvtheme.rv-cat .rv-cat-desc a { color:var(--accent2); }
.rvtheme.rv-cat .rv-cat-desc img { max-width:100%; height:auto; border-radius:8px; }
.rvtheme.rv-cat .rv-cat-desc ul, .rvtheme.rv-cat .rv-cat-desc ol { margin:0 0 10px 20px; padding:0; }
.rvtheme.rv-cat .rv-cat-desc table { width:auto; max-width:100%; }
.rvtheme.rv-cat .rv-cat-desc [style*="color"] { color:inherit !important; }   /* the stored HTML was written for a white page: its dark inline text colors would vanish on the dark card */
.rvtheme.rv-cat .rv-cat-desc [style*="background"] { background:transparent !important; }
.rvtheme.rv-cat .rv-cat-tiles { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:14px; }
.rvtheme.rv-cat .rv-cat-tile { display:flex; flex-direction:column; align-items:center; gap:10px; height:100%; padding:14px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(180deg,rgba(30,41,59,.9),rgba(23,32,50,.9)); color:var(--txt); text-decoration:none; text-align:center; }
.rvtheme.rv-cat .rv-cat-tile:hover, .rvtheme.rv-cat .rv-cat-tile:focus-visible { border-color:var(--accent2); box-shadow:0 0 0 1px var(--accent2) inset; text-decoration:none; }
.rvtheme.rv-cat .rv-cat-tile-img { display:flex; align-items:center; justify-content:center; width:100%; aspect-ratio:1 / 1; max-width:200px; background:#fff; border-radius:10px; overflow:hidden; }
.rvtheme.rv-cat .rv-cat-tile-img img { width:100%; height:100%; object-fit:contain; }
.rvtheme.rv-cat .rv-cat-tile-name { font-size:15px; font-weight:700; line-height:1.3; flex:1 0 auto; }
.rvtheme.rv-cat .rv-cat-tile-n { color:var(--muted); font-weight:600; }
.rvtheme.rv-cat .rv-cat-tile-go { width:auto; min-width:140px; margin:0; pointer-events:none; }
@media (max-width:560px) { .rvtheme.rv-cat .rv-cat-tiles { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; } .rvtheme.rv-cat .rv-cat-tile { padding:10px; } .rvtheme.rv-cat .rv-cat-tile-go { min-width:0; width:100%; font-size:12px; } .rvtheme.rv-cat .rv-cat-photos li, .rvtheme.rv-cat .rv-cat-photos img { width:120px; } .rvtheme.rv-cat .rv-cat-photos img { height:120px; } }

/* MANUALS PAGE (schematic/manual_main_next.tpl + rv_manuals.js, key "Category Pages", ticket 2026-10-03_14-52-21_Russell, 2026-10-09). "Select Your Rainbow" reuses the search page's machine cards
   (.rv-mp-card) as buttons; the chosen machine is outlined. A machine's manuals and the Miscellaneous Accessories are cards in a grid: picture, what it is, its name, the PDF buttons (purple = go look,
   gray = Unavailable), staff edit links. Text is the page's standard 14px. */
.rvtheme.rv-man .rv-man-lead { margin:0; font-size:14px; color:var(--muted); }
.rvtheme.rv-man .rv-man-h2 { margin:6px 0 0; font-size:18px; font-weight:800; color:var(--txt); }
.rvtheme.rv-man button.rv-man-pickbtn { margin:0; padding:8px 6px; min-height:0; font:600 14px/1.2 sans-serif; font-family:inherit; text-transform:none; letter-spacing:normal; color:var(--txt); box-shadow:none; text-shadow:none; animation:none; overflow:visible; cursor:pointer; }
.rvtheme.rv-man button.rv-man-pickbtn::before, .rvtheme.rv-man button.rv-man-pickbtn::after { content:none; display:none; }
.rvtheme.rv-man button.rv-man-pickbtn:hover { background:rgba(30,41,59,.6); transform:none; }
.rvtheme.rv-man button.rv-man-pickbtn.is-on { border-color:var(--accent2); box-shadow:0 0 0 2px var(--accent2) inset; background:rgba(34,211,238,.08); }
.rvtheme.rv-man .rv-man-panel[hidden] { display:none; }
.rvtheme.rv-man .rv-man-panel { scroll-margin-top:120px; }
.rvtheme.rv-man .rv-man-h3 { margin:0 0 12px; font-size:18px; font-weight:800; color:var(--txt); outline:none; }
.rvtheme.rv-man .rv-man-grid { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:14px; }
.rvtheme.rv-man .rv-man-card { display:flex; flex-direction:column; align-items:center; gap:6px; padding:12px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(180deg,rgba(30,41,59,.9),rgba(23,32,50,.9)); text-align:center; font-size:14px; color:var(--txt); }
.rvtheme.rv-man .rv-man-img { display:flex; align-items:center; justify-content:center; width:100%; max-width:150px; aspect-ratio:1 / 1; background:#fff; border-radius:10px; overflow:hidden; }
.rvtheme.rv-man .rv-man-img img { width:100%; height:100%; object-fit:contain; }
.rvtheme.rv-man .rv-man-head { color:var(--muted); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.rvtheme.rv-man .rv-man-name { font-weight:700; line-height:1.3; flex:1 0 auto; }
.rvtheme.rv-man .rv-man-btns { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; width:100%; }
.rvtheme.rv-man .rv-man-btns .btn { width:auto; min-width:110px; margin:0; justify-content:center; }
.rvtheme.rv-man .rv-man-staff { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; } .rvtheme.rv-man .rv-man-staff a { color:#facc15; font-weight:700; font-size:13px; }
@media (max-width:560px) { .rvtheme.rv-man .rv-man-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; } .rvtheme.rv-man .rv-man-card { padding:10px; } .rvtheme.rv-man .rv-man-btns .btn { min-width:0; width:100%; font-size:12px; padding:9px 8px; } }
.rvtheme.rv-man button.rv-man-img { margin:0; padding:0; min-height:0; border:0; font:inherit; box-shadow:none; text-shadow:none; animation:none; cursor:zoom-in; overflow:hidden; }
.rvtheme.rv-man button.rv-man-img::before, .rvtheme.rv-man button.rv-man-img::after { content:none; display:none; }
.rvtheme.rv-man button.rv-man-img:hover, .rvtheme.rv-man button.rv-man-img:focus-visible { background:#fff; transform:none; outline:2px solid var(--accent2); outline-offset:2px; }
/* Centered (2026-10-09): a tile's "View Items" label sits in the middle of its button (Russell 10/8 on Load More: "center it in the button"), and a row that is not full
   sits in the middle of the page, not against the left edge (Russell on Compare: "in a case of two items, why don't we place them in the center together"): Fragrances has 2 tiles,
   some machines have 1 or 2 manuals. Columns keep one width (200-230px) so a short row does not stretch. A lone card on a phone is centered at half width. */
.rvtheme.rv-cat .rv-cat-tile-go { justify-content:center; text-align:center; }
.rvtheme.rv-cat .rv-cat-tiles { grid-template-columns:repeat(auto-fit, minmax(200px, 230px)); justify-content:center; }
.rvtheme.rv-man .rv-man-grid { grid-template-columns:repeat(auto-fit, minmax(190px, 230px)); justify-content:center; }
@media (max-width:560px) { .rvtheme.rv-cat .rv-cat-tiles, .rvtheme.rv-man .rv-man-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .rvtheme.rv-cat .rv-cat-tiles:has(> li:only-child), .rvtheme.rv-man .rv-man-grid:has(> li:only-child) { grid-template-columns:minmax(0, calc(50% - 5px)); } }


/* TRACKING PAGE (public_html/track.php, the page a tracking number opens; key "Tracking Look", ticket 2026-10-03_14-52-21_Russell, phase 2, 2026-10-09: "rewrite its own cards, buttons, fonts and colors
   onto the site standard"). Root: #rvtrk-root.rvtheme.rv-trk under the shell's H1 "Shipment Tracking". Same layout as before (status | map | history on a wide screen, one column below 1180px); what
   changes is the look: the site font at the standard 14px everywhere (labels 12px upper-case like a .field label, card headings 15px like .card > h3), theme cards, the theme's purple Track /
   Show details buttons, theme fields with problems ON the box, the shared picture popup for the delivery photo. The page's own color names (--brand, --live ...) are mapped to the theme here,
   so the few inline var() colors in the markup follow. The map tiles, route colors and Leaflet stay as they were. */
/* Built 2026-10-09 from the page's old inline <style> (every rule moved under .rvtheme.rv-trk; the page-wide variables, its own photo viewer and the old-header fixes left out) with the
   site-standard fonts, sizes and colors merged in. One block, no second copy: track.php prints its inline <style> only while this key is off; purge that at promotion. */
.rvtheme.rv-trk .rvtrk-pagehead { background:linear-gradient(180deg,rgba(30,41,59,.9),rgba(23,32,50,.9)); border-bottom:1px solid var(--line); padding:14px 16px; border:1px solid var(--line); border-radius:14px; }
.rvtheme.rv-trk .rvtrk-pagehead-inner { max-width:none; margin:0; display:flex; align-items:center; gap:12px 18px; flex-wrap:wrap; }
.rvtheme.rv-trk .rvtrk-brand { display:none; flex-direction:column; align-items:flex-start; gap:3px; flex:0 0 auto; }
.rvtheme.rv-trk .rvtrk-tnform { display:flex; gap:10px; flex:1 1 360px; min-width:0; max-width:600px; align-items:stretch; flex-wrap:wrap; }
.rvtheme.rv-trk .rvtrk-tnfield { flex:1 1 230px; position:relative; display:flex; align-items:center; background:#0a1020; border:1px solid var(--line); border-radius:10px; padding:0 12px; min-width:0; }
.rvtheme.rv-trk .rvtrk-tnfield:focus-within { border-color:var(--accent); }
.rvtheme.rv-trk .rvtrk-tnfield-pre { font-size:12px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; color:var(--muted); padding-right:10px; border-right:1px solid var(--line); margin-right:10px; white-space:nowrap; }
.rvtheme.rv-trk .rvtrk-tnfield input { flex:1; min-width:0; background:none; border:none; outline:none; color:var(--ink); padding:10px 0; }
.rvtheme.rv-trk .rvtrk-tnfield input::placeholder { color:var(--faint); font-family:inherit; }
.rvtheme.rv-trk .rvtrk-tnfield-detected { font-size:12px; font-weight:700; color:var(--accent2); white-space:nowrap; margin-left:8px; }
.rvtheme.rv-trk .rvtrk-linkline { display:flex; align-items:center; gap:8px; min-width:0; flex:1 1 100%; font-family:inherit; font-size:14px; }
.rvtheme.rv-trk .rvtrk-linkline-icon { color:var(--faint); display:flex; flex:none; }
.rvtheme.rv-trk .rvtrk-linkline-url { color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rvtheme.rv-trk .rvtrk-linkline-url b { color:var(--accent2); font-weight:700; }
.rvtheme.rv-trk .rvtrk-copybtn { flex:none; background:none; border:none; color:var(--faint); padding:5px; border-radius:6px; cursor:pointer; display:inline-flex; align-items:center; }
.rvtheme.rv-trk .rvtrk-copybtn:hover { color:var(--ink); background:var(--card2); }
.rvtheme.rv-trk .rvtrk-copybtn.rvtrk-copied { color:var(--good); }
.rvtheme.rv-trk .rvtrk-page { width:100%; background:none; min-height:0; }
.rvtheme.rv-trk .rvtrk-content { max-width:none; margin:0; padding:0; }
.rvtheme.rv-trk .rvtrk-lead { font-size:14px; color:var(--muted); margin:0; }
.rvtheme.rv-trk .rvtrk-card { background:linear-gradient(180deg,rgba(30,41,59,.9),rgba(23,32,50,.9)); border:1px solid var(--line); border-radius:14px; box-shadow:none; overflow:hidden; margin-bottom:14px; background-color:#162034; }
.rvtheme.rv-trk .rvtrk-bd { padding:16px; }
.rvtheme.rv-trk .rvtrk-hero { display:grid; grid-template-columns:320px 1fr 320px; gap:14px; align-items:start; margin-bottom:14px; }
.rvtheme.rv-trk .rvtrk-hero-left { display:flex; flex-direction:column; gap:14px; min-width:0; }
.rvtheme.rv-trk .rvtrk-hero-left .rvtrk-card { margin-bottom:0; }
.rvtheme.rv-trk .rvtrk-hero-center .rvtrk-card { margin-bottom:0; }
.rvtheme.rv-trk .rvtrk-hero-right .rvtrk-card { margin-bottom:0; }
.rvtheme.rv-trk .rvtrk-h2 { font-size:15px; text-transform:none; letter-spacing:normal; color:var(--txt); margin:0 0 12px; font-weight:700; }
.rvtheme.rv-trk .rvtrk-status-row { display:flex; align-items:center; gap:12px; margin-bottom:10px; flex-wrap:wrap; }
.rvtheme.rv-trk .rvtrk-ring { width:42px; height:42px; flex:0 0 auto; }
.rvtheme.rv-trk .rvtrk-ring svg { transform:rotate(-90deg); display:block; }
.rvtheme.rv-trk .rvtrk-ring.good { color:var(--good); }
.rvtheme.rv-trk .rvtrk-ring.live { color:var(--live); }
.rvtheme.rv-trk .rvtrk-ring.warn { color:var(--warn); }
.rvtheme.rv-trk .rvtrk-ring.bad { color:var(--bad); }
.rvtheme.rv-trk .rvtrk-ring.off { color:var(--off); }
.rvtheme.rv-trk .rvtrk-status-txt .rvtrk-big { font-size:20px; font-weight:800; color:var(--txt); }
.rvtheme.rv-trk .rvtrk-status-txt .rvtrk-sm { font-size:14px; color:var(--muted); margin-top:2px; }
.rvtheme.rv-trk .rvtrk-tnrow { font-size:14px; color:var(--muted); margin:0 0 10px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.rvtheme.rv-trk .rvtrk-tnrow img { height:18px; vertical-align:middle; background:#fff; border-radius:4px; padding:2px 4px; }
.rvtheme.rv-trk .rvtrk-tnrow b { color:var(--txt); font-family:inherit; font-size:14px; letter-spacing:.02em; }
.rvtheme.rv-trk .rvtrk-vroute { position:relative; padding-left:22px; }
.rvtheme.rv-trk .rvtrk-vroute:before { content:''; position:absolute; left:5px; top:6px; bottom:6px; width:2px; background:var(--line); }
.rvtheme.rv-trk .rvtrk-vstop { position:relative; padding-bottom:16px; }
.rvtheme.rv-trk .rvtrk-vstop:last-child { padding-bottom:0; }
.rvtheme.rv-trk .rvtrk-vdot { position:absolute; left:-22px; top:2px; width:11px; height:11px; border-radius:50%; background:#162034; border:2px solid var(--faint); border-color:var(--muted); }
.rvtheme.rv-trk .rvtrk-vdot.good { border-color:var(--good); background:var(--good); }
.rvtheme.rv-trk .rvtrk-vdot.live { border-color:var(--accent2); background:var(--accent2); }
.rvtheme.rv-trk .rvtrk-vlabel { font-size:12px; text-transform:uppercase; letter-spacing:.3px; color:var(--muted); font-weight:700; margin-bottom:2px; }
.rvtheme.rv-trk .rvtrk-vval { font-size:14px; color:var(--txt); }
.rvtheme.rv-trk .rvtrk-vval a.rvtrk-maplink { color:inherit; text-decoration:none; }
.rvtheme.rv-trk .rvtrk-vval a.rvtrk-maplink:hover { text-decoration:underline; color:var(--brand); }
.rvtheme.rv-trk .rvtrk-handoff { background:var(--panel); border:1px dashed var(--line2); border-radius:10px; padding:8px 10px; font-size:14px; color:var(--muted); margin:0 0 12px; }
.rvtheme.rv-trk .rvtrk-handoff a { color:var(--accent2); text-decoration:none; font-family:inherit; }
.rvtheme.rv-trk .rvtrk-handoff a:hover { text-decoration:underline; }
.rvtheme.rv-trk .rvtrk-addr a.rvtrk-maplink { color:inherit; text-decoration:none; }
.rvtheme.rv-trk .rvtrk-addr a.rvtrk-maplink:hover { text-decoration:underline; }
.rvtheme.rv-trk .rvtrk-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px 16px; margin-bottom:2px; }
.rvtheme.rv-trk .rvtrk-cell .rvtrk-k { font-size:12px; text-transform:uppercase; letter-spacing:.3px; color:var(--muted); font-weight:700; margin-bottom:2px; }
.rvtheme.rv-trk .rvtrk-cell .rvtrk-v { font-size:14px; color:var(--txt); }
.rvtheme.rv-trk .rvtrk-pkgrow { display:flex; align-items:center; gap:10px; }
.rvtheme.rv-trk .rvtrk-pkgrow.rvtrk-pkgrow-logo { background:#fff; border-radius:8px; padding:7px 12px; }
.rvtheme.rv-trk .rvtrk-pkglogo { height:20px; width:auto; max-width:130px; display:block; flex:0 0 auto; }
.rvtheme.rv-trk .rvtrk-pkgsvc { font-size:14px; color:var(--txt); }
.rvtheme.rv-trk .rvtrk-pkgrow-logo .rvtrk-pkgsvc { color:#1f2937; }
.rvtheme.rv-trk .rvtrk-tl { margin:0; padding:0; list-style:none; border-left:2px solid var(--line); margin-left:6px; border-left-color:var(--line2); }
.rvtheme.rv-trk .rvtrk-tl li { position:relative; padding:0 0 11px 20px; }
.rvtheme.rv-trk .rvtrk-tl li:last-child { padding-bottom:0; }
.rvtheme.rv-trk .rvtrk-tl li:before { content:''; position:absolute; left:-6px; top:3px; width:10px; height:10px; border-radius:50%; background:var(--muted); border:2px solid var(--card); border-color:#162034; }
.rvtheme.rv-trk .rvtrk-tl li.rvtrk-first:before { background:var(--accent2); width:12px; height:12px; left:-7px; }
.rvtheme.rv-trk .rvtrk-tl .rvtrk-w { font-size:14px; color:var(--muted); }
.rvtheme.rv-trk .rvtrk-tl .rvtrk-d { font-size:14px; color:var(--txt); margin:1px 0; }
.rvtheme.rv-trk .rvtrk-tl .rvtrk-p { font-size:14px; color:var(--muted); }
.rvtheme.rv-trk .rvtrk-addr { font-size:14px; line-height:1.5; color:var(--txt); }
.rvtheme.rv-trk .rvtrk-podphoto { display:block; width:100%; max-height:320px; object-fit:contain; border-radius:10px; margin-bottom:10px; background:#0a1020; cursor:zoom-in; }
.rvtheme.rv-trk .rvtrk-podphoto-cap { font-size:12px; color:var(--muted); text-align:center; margin:-6px 0 10px; }
.rvtheme.rv-trk .rvtrk-pod { background:var(--goodbg); border:1px solid var(--goodline); border-radius:10px; padding:10px 13px; font-size:14px; }
.rvtheme.rv-trk .rvtrk-pod .rvtrk-t { font-weight:700; color:var(--good); margin-bottom:3px; }
.rvtheme.rv-trk .rvtrk-pod-pending { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:10px 13px; color:var(--muted); font-size:14px; }
.rvtheme.rv-trk .rvtrk-vinput { width:100%; padding:8px; border-radius:8px; border:1px solid #334155; background:#0f172a; color:inherit; }
.rvtheme.rv-trk .rvtrk-unavail { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:10px 13px; color:var(--muted); font-size:14px; }
.rvtheme.rv-trk #rvtrk-map { height:634px; border-radius:0; background:var(--card2); position:relative; z-index:1; }
.rvtheme.rv-trk #rvtrk-map .leaflet-tile-pane { filter:invert(1) hue-rotate(180deg) brightness(0.92) contrast(0.9); }
.rvtheme.rv-trk .rvtrk-hero-center .rvtrk-bd { padding:0; }
.rvtheme.rv-trk .rvtrk-mapwrap { position:relative; }
.rvtheme.rv-trk .rvtrk-mapchips { position:absolute; left:14px; top:14px; z-index:600; display:flex; gap:10px; flex-wrap:wrap; max-width:calc(100% - 28px); }
.rvtheme.rv-trk .rvtrk-chip { background:rgba(11,18,32,.86); backdrop-filter:blur(8px); border:1px solid var(--line); border-radius:10px; padding:8px 12px; border-color:var(--line2); }
.rvtheme.rv-trk .rvtrk-chip-k { font-size:12px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; color:var(--muted); }
.rvtheme.rv-trk .rvtrk-chip-v { font-size:14px; font-weight:700; margin-top:5px; color:var(--accent2); }
.rvtheme.rv-trk .rvtrk-chip-v small { font-size:12px; font-weight:500; color:var(--muted); margin-left:4px; font-family:inherit; }
.rvtheme.rv-trk .rvtrk-viewtoggle { position:absolute; right:14px; bottom:14px; z-index:600; display:flex; background:rgba(11,18,32,.86); backdrop-filter:blur(8px); border:1px solid var(--line); border-radius:9px; padding:4px; gap:3px; border-color:var(--line2); }
.rvtheme.rv-trk .rvtrk-viewtoggle button { font-family:inherit; border:0; background:none; cursor:pointer; color:var(--muted); font-size:12px; font-weight:700; letter-spacing:normal; padding:7px 13px; border-radius:7px; width:auto; min-height:0; margin:0; text-transform:none; box-shadow:none; animation:none; overflow:visible; }
.rvtheme.rv-trk .rvtrk-viewtoggle button.rvtrk-on { background:var(--accent2); color:#04202e; }
.rvtheme.rv-trk .rvtrk-maplegend { position:absolute; left:14px; bottom:14px; z-index:600; background:rgba(11,18,32,.86); backdrop-filter:blur(8px); border:1px solid var(--line); border-radius:10px; padding:9px 12px; display:flex; flex-direction:column; gap:6px; border-color:var(--line2); }
.rvtheme.rv-trk .rvtrk-maplegend span { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--muted); }
.rvtheme.rv-trk .rvtrk-maplegend i { display:inline-block; width:18px; height:0; border-top:3px solid var(--good); flex:none; }
.rvtheme.rv-trk .rvtrk-maplegend i.rvtrk-dash { border-top-color:var(--faint); border-top-style:dashed; }
.rvtheme.rv-trk .rvtrk-maplegend b { display:inline-block; width:10px; height:10px; border-radius:50%; flex:none; }
.rvtheme.rv-trk .leaflet-popup-content { font-size:14px; line-height:1.5; }
.rvtheme.rv-trk .leaflet-popup-content-wrapper, .rvtheme.rv-trk .leaflet-popup-tip { background:var(--card); color:var(--ink); }
.rvtheme.rv-trk .leaflet-popup-content b { color:var(--ink); }
.rvtheme.rv-trk .rvtrk-cols2 { display:grid; grid-template-columns:1fr 380px; gap:14px; align-items:start; }
.rvtheme.rv-trk .rvtrk-sec + .rvtrk-sec { margin-top:14px; padding-top:14px; border-top:1px solid var(--line); border-top-color:var(--line); }
.rvtheme.rv-trk .rvtrk-bad-link { text-align:center; padding:34px 22px; color:var(--muted); font-size:14px; }
.rvtheme.rv-trk .rvtrk-foot { text-align:center; font-size:14px; color:var(--muted); padding:10px 20px 18px; margin:6px 0 0; }
.rvtheme.rv-trk { --faint:#8592a8; --brand:var(--accent2); --live:var(--accent2); --ink:var(--txt); --soft:var(--muted); --card:#162034; --card2:#0a1020; --off:#94a3b8; --goodbg:rgba(52,211,153,.12); --goodline:rgba(52,211,153,.35); --offbg:rgba(148,163,184,.12); padding:0; background:none; border-radius:0; }
.rvtheme.rv-trk .rvtrk-content > .rvtrk-page > .rvtrk-content { padding:14px 0 0; }
.rvtheme.rv-trk .rvtrk-tnfield input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=reset]) {   /* the same :not() chain as the theme's field rule, or that rule (0,7,1) wins and draws a second box inside the field */
  flex:1; width:100%; min-width:0; margin:0; padding:11px 0; border:0; border-radius:0; background:transparent; box-shadow:none; font-size:14px; font-family:inherit; letter-spacing:.02em; }
.rvtheme.rv-trk .btn.rvtrk-trackbtn { flex:0 0 auto; width:auto; min-width:110px; height:auto; margin:0; padding:10px 22px; justify-content:center; font-size:14px; text-transform:none; letter-spacing:normal; filter:none; }
.rvtheme.rv-trk button.rvtrk-copybtn { font-family:inherit; flex:0 0 auto; width:auto; min-height:0; margin:0; padding:6px; border:1px solid var(--line); border-radius:8px; background:transparent; color:var(--muted); box-shadow:none; }
.rvtheme.rv-trk button.rvtrk-copybtn:hover { color:var(--txt); border-color:var(--accent2); }
.rvtheme.rv-trk button.rvtrk-copybtn.rvtrk-copied { color:var(--good); border-color:var(--good); }
.rvtheme.rv-trk .rvtrk-status-txt .rvtrk-eta { color:var(--accent2); font-weight:700; }
.rvtheme.rv-trk .rvtrk-v { font-size:14px; color:var(--txt); }
.rvtheme.rv-trk a.rvtrk-maplink { color:inherit; }
.rvtheme.rv-trk a.rvtrk-maplink:hover { color:var(--accent2); }
.rvtheme.rv-trk .rvtrk-vform .field { margin-bottom:10px; }
.rvtheme.rv-trk #rvtrk-vcard { scroll-margin-top:245px; }   /* after a ZIP / last-name try the page jumps to the whole card (boxes, the message ON the box, the button) and keeps it BELOW the sticky header (~204px desktop, ~229px phone) */
.rvtheme.rv-trk .rvtrk-hero:not(:has(.rvtrk-hero-center)) { grid-template-columns:320px 1fr; }   /* no map (fewer than 2 places known): the history takes the rest of the row instead of a middle column with an empty one beside it */
@media (max-width:1180px) { .rvtheme.rv-trk .rvtrk-hero:not(:has(.rvtrk-hero-center)) { grid-template-columns:1fr; } }
.rvtheme.rv-trk .rvtrk-tnform .rvtrk-tnfield, .rvtheme.rv-trk .rvtrk-tnform .btn.rvtrk-trackbtn { height:44px; min-height:44px; padding-top:0; padding-bottom:0; align-self:center; }   /* the box and the Track button the same height (they were 40 / 50) */
.rvtheme.rv-trk .rvtrk-tnform .rvtrk-tnfield:focus-within { border-color:var(--accent2); box-shadow:0 0 0 1px var(--accent2); }   /* the focus ring is on the whole box ... */
.rvtheme.rv-trk .rvtrk-tnfield input:focus, .rvtheme.rv-trk .rvtrk-tnfield input:focus-visible { outline:none !important; }   /* ... not a second ring around the text inside it (the theme's keyboard ring is !important, so this one is too; the box above carries the ring) */
.rvtheme.rv-trk .rvtrk-vor { margin:0 0 10px; text-align:center; color:var(--muted); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.3px; }
.rvtheme.rv-trk .rvtrk-vform .btn.rvtrk-trackbtn { width:100%; }
.rvtheme.rv-trk .rvtrk-podphoto:focus-visible { outline:2px solid var(--accent2); outline-offset:2px; }
.rvtheme.rv-trk .rvtrk-viewtoggle button::before { content:none; display:none; }
.rvtheme.rv-trk .rvtrk-viewtoggle button::after { content:none; display:none; }
.rvtheme.rv-trk button.rvtrk-copybtn::before { content:none; display:none; }
.rvtheme.rv-trk button.rvtrk-copybtn::after { content:none; display:none; }
.rvtheme.rv-trk .leaflet-popup-content-wrapper { background:#162034; color:var(--txt); }
.rvtheme.rv-trk .leaflet-popup-tip { background:#162034; color:var(--txt); }
.rvtheme.rv-trk .rvtrk-foot a { color:var(--accent2) !important; }
@media(max-width:1180px) {
  .rvtheme.rv-trk .rvtrk-hero { grid-template-columns:1fr; }
  .rvtheme.rv-trk .rvtrk-cols2 { grid-template-columns:1fr; }
}
@media(max-width:760px) {
  .rvtheme.rv-trk .rvtrk-content { padding:16px 14px 40px; }
  .rvtheme.rv-trk .rvtrk-bd { padding:18px; }
  .rvtheme.rv-trk .rvtrk-grid { grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); }
  .rvtheme.rv-trk .rvtrk-pagehead-inner { flex-direction:column; align-items:stretch; }
  .rvtheme.rv-trk .rvtrk-tnform { max-width:none; flex:0 0 auto; width:100%; }
  .rvtheme.rv-trk .rvtrk-tnfield { min-width:0; }
  .rvtheme.rv-trk .rvtrk-linkline { flex:0 0 auto; max-width:100%; }
  .rvtheme.rv-trk .rvtrk-linkline-url { overflow:hidden; text-overflow:ellipsis; }
}
@media(max-width:560px) {
  .rvtheme.rv-trk .rvtrk-tnfield-pre { display:none; }
  .rvtheme.rv-trk .btn.rvtrk-trackbtn { flex:1 1 100%; }
  .rvtheme.rv-trk .rvtrk-bd { padding:14px; }
}