/* Shared JU appearance primitives. Product imagery and print remain untouched. */
:root{--ju-font:'IBM Plex Sans Arabic',system-ui,sans-serif;--ju-surface:#101a30;--ju-text:#edf2fc;--ju-muted:#a2b0ca;--ju-line:rgba(160,182,226,.24);--ju-accent:#b49aff;--ju-control:#15223b;--ju-shadow:0 8px 28px rgba(0,0,0,.15)}
@media screen{html[data-ju-theme=light]{--ju-surface:#eee9e0;--ju-text:#17223b;--ju-muted:#46516a;--ju-line:#bdb4a5;--ju-accent:#593099;--ju-control:#e3dbcf;--ju-shadow:0 8px 28px rgba(40,32,51,.13)}}
.ju-theme-toggle{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;min-width:42px;padding:8px 12px;margin:0;border:1px solid var(--ju-line);border-radius:9px;background:var(--ju-control);color:var(--ju-text);font:500 13px/1.6 var(--ju-font);white-space:nowrap;cursor:pointer;touch-action:manipulation;box-shadow:none;vertical-align:middle;flex-shrink:0}
.ju-theme-toggle svg{display:block;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ju-theme-toggle:hover{border-color:var(--ju-accent);color:var(--ju-accent)}
.ju-theme-toggle:focus-visible{outline:2px solid var(--ju-accent);outline-offset:3px}
[data-ju-theme-mount]{display:inline-flex;align-items:center}
.ju-theme-fallback[data-ju-theme-mount]{display:flex;justify-content:flex-end;width:100%;padding:12px 20px;background:var(--ju-surface);position:relative;z-index:20}
html[data-ju-theme-controls=ready] #ju-bk-bar .ju-bk-theme{display:none}
@media screen and (prefers-reduced-motion:no-preference){html.ju-theme-changing body,html.ju-theme-changing header,html.ju-theme-changing footer,html.ju-theme-changing main,html.ju-theme-changing section,html.ju-theme-changing article,html.ju-theme-changing .card,html.ju-theme-changing button,html.ju-theme-changing input,html.ju-theme-changing select{transition:background-color .16s ease,border-color .16s ease,color .16s ease}}
@media(max-width:600px){.ju-theme-toggle{padding:8px;min-width:42px}.ju-theme-toggle-label{display:none}}
@media(prefers-reduced-motion:reduce){.ju-theme-toggle{transition:none!important}}
@media print{.ju-theme-toggle,[data-ju-theme-mount]{display:none!important}}

/* JU official PNG stays unaltered. Only its visibility is animated. */
.ju-brand-loader{
  --ju-loader-surface:var(--ju-surface,#ffffff);
  --ju-loader-text:var(--ju-text,#182039);
  --ju-loader-accent:var(--ju-accent,#6548d9);
  box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:12px;pointer-events:none!important;user-select:none;font:inherit;color:var(--ju-loader-text);
  padding:18px;isolation:isolate;opacity:1;
}
.ju-brand-loader *{box-sizing:border-box;pointer-events:none!important}
.ju-brand-loader--corner{
  position:fixed;inset-block-start:max(16px,env(safe-area-inset-top));inset-inline-end:max(16px,env(safe-area-inset-right),env(safe-area-inset-left));
  z-index:40;width:132px;max-width:calc(100vw - 32px);border:1px solid rgba(125,132,154,.2);border-radius:14px;
  background:var(--ju-loader-surface);box-shadow:0 8px 28px rgba(11,16,35,.1);gap:9px;padding:14px 12px;
}
.ju-brand-loader--inline{position:relative;width:100%;max-width:360px;margin-inline:auto;padding:22px 16px}
.ju-brand-loader--hero{gap:18px;min-height:224px;padding:32px 24px}
.ju-brand-loader__art{display:block;position:relative;width:80px;max-width:100%;aspect-ratio:895/729}
.ju-brand-loader--inline .ju-brand-loader__art{width:108px}
.ju-brand-loader--hero .ju-brand-loader__art{width:184px}
.ju-brand-loader__logo{display:block;width:100%;height:auto;max-width:none;object-fit:contain;opacity:0}
.ju-brand-loader.is-image-ready .ju-brand-loader__logo{opacity:1;animation:ju-brand-draw .72s cubic-bezier(.18,.65,.28,1) both}
.ju-brand-loader__trace{display:block;height:2px;width:76px;max-width:65%;overflow:hidden;background:rgba(125,132,154,.16);border-radius:0}
.ju-brand-loader--hero .ju-brand-loader__trace{width:150px}
.ju-brand-loader__trace::after{
  content:"";display:block;width:48%;height:100%;background:linear-gradient(90deg,#2E6BFF,#7A3BFF,#FF4FA3);
  transform:translateX(-110%);animation:ju-brand-trace 1.4s cubic-bezier(.5,0,.25,1) infinite;
}
.ju-brand-loader__label{display:block;max-width:30ch;text-align:center;font:inherit;font-size:.78rem;line-height:1.6;color:inherit;opacity:.76;overflow-wrap:anywhere}
.ju-brand-loader--hero .ju-brand-loader__label{font-size:.88rem;letter-spacing:0}
html[data-ju-theme="dark"] .ju-brand-loader{--ju-loader-surface:var(--ju-surface,#11172b);--ju-loader-text:var(--ju-text,#ecedf4)}
@media(prefers-color-scheme:dark){html:not([data-ju-theme]) .ju-brand-loader{--ju-loader-surface:var(--ju-surface,#11172b);--ju-loader-text:var(--ju-text,#ecedf4)}}
@keyframes ju-brand-draw{
  0%{clip-path:polygon(0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0)}
  30%{clip-path:polygon(0 0,88% 0,72% 36%,0 36%,0 36%,0 36%,0 36%,0 36%)}
  64%{clip-path:polygon(0 0,100% 0,100% 36%,88% 36%,65% 76%,0 76%,0 76%,0 76%)}
  84%{clip-path:polygon(0 0,100% 0,100% 76%,75% 76%,90% 100%,0 100%,0 100%,0 100%)}
  100%{clip-path:polygon(0 0,100% 0,100% 100%,100% 100%,100% 100%,0 100%,0 100%,0 100%)}
}
@keyframes ju-brand-trace{0%{transform:translateX(-110%)}100%{transform:translateX(320%)}}
@media(max-width:480px){.ju-brand-loader--corner{width:108px;padding:12px 8px;gap:7px}.ju-brand-loader--corner .ju-brand-loader__art{width:62px}.ju-brand-loader--corner .ju-brand-loader__label{font-size:.7rem}.ju-brand-loader--hero{min-height:196px;padding:24px 16px}.ju-brand-loader--hero .ju-brand-loader__art{width:160px}}
@media(prefers-reduced-motion:reduce){.ju-brand-loader.is-image-ready .ju-brand-loader__logo{animation:none;clip-path:none}.ju-brand-loader__trace::after{animation:none;transform:none;width:100%}}
@media print{.ju-brand-loader{display:none!important}}

/* JU Website theme v1 · Website 1 only, activated by the shared theme runtime.
   Based on the exact Odoo assets/pages backed up 2026-10-29. No image recoloring,
   swatch recoloring or booking calendar/selected-slot overrides. */

/* Keep the existing appointment lookup form inside its mobile card. */
@media screen and (max-width:600px) {
  html[data-ju-theme] #ju-lp .ju-lp-chk-f { min-width:0; max-width:100%; flex-basis:100%; }
}

/* Abdullah's confirmed typeface, including older decorative text variables.
   Icon fonts and image-based brand marks keep their own rendering. */
html[data-ju-theme],
html[data-ju-theme] :is(#ju-root,#ju-svc,#juclr,#jushopoffers,#juabout,#jucontact,#jupapers,#jusupply,#jupolicies,#juans,#juc2,#jumodal,#jubar) {
  --ff-ar: 'IBM Plex Sans Arabic', sans-serif !important;
  --ff-en: 'IBM Plex Sans Arabic', sans-serif !important;
  --ff-lux: 'IBM Plex Sans Arabic', sans-serif !important;
  --ff-serif: 'IBM Plex Sans Arabic', sans-serif !important;
  --bk-font: 'IBM Plex Sans Arabic', sans-serif !important;
}
html[data-ju-theme] body,
html[data-ju-theme] #wrapwrap,
html[data-ju-theme] :is(#ju-root,#ju-svc,#juclr,#jushopoffers,#juabout,#jucontact,#jupapers,#jusupply,#jupolicies,#juans,#juc2,#jumodal,#jubar) {
  font-family: 'IBM Plex Sans Arabic', sans-serif !important;
}
html[data-ju-theme] #wrapwrap :is(h1,h2,h3,h4,h5,h6,p,small,strong,b,label,legend,button,input,select,textarea,th,td,a,span,div,em,summary,li,dt,dd,figcaption):not(.fa):not(.fab):not(.fas):not(.far):not(.oi):not(.o_icon):not(.material-icons):not([class*="fa-"]) {
  font-family: 'IBM Plex Sans Arabic', sans-serif !important;
}
/* These plain <i> elements contain numeric filter counts, not icon glyphs. */
html[data-ju-theme] #juclr .fb i { font-family: 'IBM Plex Sans Arabic', sans-serif !important; }
/* The old #ju-root universal/button reset otherwise removes the new control's
   padding, border and background despite the bundle loading later. */
html[data-ju-theme] #ju-root .ju-theme-toggle {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  min-height: 42px; min-width: 42px; padding: 8px 12px; margin: 0;
  border: 1px solid var(--ju-line); border-radius: 9px;
  background: var(--ju-control); color: var(--ju-text);
  font: 500 13px/1.6 'IBM Plex Sans Arabic', sans-serif;
  white-space: nowrap; flex-shrink: 0;
}
html[data-ju-theme] #ju-root .ju-theme-toggle:hover { border-color: var(--ju-accent); color: var(--ju-accent); }
html[data-ju-theme] #ju-root .ju-theme-toggle svg { width: 14px; height: 14px; }
@media screen and (max-width:600px) {
  html[data-ju-theme] #ju-root .ju-theme-toggle { padding: 8px; }
}

/* Mobile content stays in document flow. The legacy motion layer combines a
   pinned hero, deferred section painting and per-word blur; their asynchronous
   states can leave old words visible between bands while scrolling. Settle
   only that layer's marked elements, without clipping content or the menu. */
@media screen and (max-width:880px), screen and (hover:none), screen and (pointer:coarse) {
  html[data-ju-theme] #wrapwrap main #ju-root .hero { position: relative !important; top: auto !important; }
  html[data-ju-theme] #wrapwrap main #ju-root .hero > .hero-scroll { display: none !important; }
  html[data-ju-theme] #wrapwrap main :is(#ju-root,#ju-svc) > section {
    content-visibility: visible !important; contain-intrinsic-size: none !important;
    isolation: isolate;
  }
  html[data-ju-theme] #wrapwrap main :is(.sr-i,.br,.rv,.reveal,.appr),
  html[data-ju-theme] #wrapwrap main #ju-root .hero-inner {
    opacity: 1 !important; transform: none !important; filter: none !important;
    animation: none !important; transition: none !important; will-change: auto !important;
  }
  html[data-ju-theme] #wrapwrap main :is(.sr-w,.sr-i) { display: inline !important; }
  /* A solid header keeps moving text from ghosting through its glass layer. */
  html[data-ju-theme] #ju-root :is(.nav,.nav.scrolled,.nav-links) {
    backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  }
  html[data-ju-theme="dark"] #ju-root #nav,
  html[data-ju-theme="dark"] #ju-root #nav .nav-links { background: #07091c !important; }
  html[data-ju-theme="light"] #ju-root #nav,
  html[data-ju-theme="light"] #ju-root #nav .nav-links { background: #d0c9bf !important; }
}

@media screen {
/* Public action labels must remain readable across the full button surface.
   These are the existing action classes, not general links or image marks. */
html[data-ju-theme] :is(#jucontact .cd a.b:not(.wa),#jucontact .ctas a.bk,#juabout .ctas a.bk,#juabout .ctas a.ct,#jupapers button.btn,#contactus_form .s_website_form_send,#ju-svc .svc-badge) {
  background: #262b4b !important; color: #ffffff !important;
}
html[data-ju-theme] #jucontact .cd a.b.wa { background: #185f3d !important; color: #ffffff !important; }
/* Keep the promotion's minimum track within its padded content box at 320px,
   while retaining the existing multi-column auto-fit layout on larger screens. */
html[data-ju-theme] #jushopoffers #ju-quarter-offer { grid-template-columns: repeat(auto-fit,minmax(min(100%,280px),1fr)) !important; }

html[data-ju-theme="light"],
html[data-ju-theme="light"] #ju-root {
  color-scheme: light;
  --ju-page: #ddd8d0;
  --ju-page-alt: #d0c9bf;
  --ju-panel: #eee9e0;
  --ju-panel-alt: #e3dbcf;
  --ju-ink: #171c38;
  --ju-copy: #4c546c;
  --ju-dim: #505469;
  --ju-line: #bdb4a5;
  --ju-line-strong: #a99b88;
  --ju-link: #60418a;
  --ju-accent: #6b501b;
  --ju-positive: #185f3d;
  --ju-negative: #992a39;
  --ju-shadow: 0 18px 44px -28px rgba(23,28,56,.32);
  --bg: var(--ju-page); --bg-1: var(--ju-page-alt); --bg-2: var(--ju-panel-alt); --bg-3: var(--ju-page-alt);
  --surface: rgba(23,28,56,.035); --surface-2: rgba(23,28,56,.055);
  --border: var(--ju-line); --border-2: #b49c70;
  --text: var(--ju-ink); --text-2: var(--ju-copy); --muted: var(--ju-dim);
  --gold: var(--ju-accent); --gold-2: var(--ju-accent); --blue: #155e8d;
  --purple: #694098; --pink: #9a315e;
  --shadow: var(--ju-shadow); --shadow-g: 0 0 28px rgba(105,64,152,.08);
  --jub: var(--ju-page); --jub2: var(--ju-page-alt); --jus: var(--ju-panel);
  --jubd: var(--ju-line); --jut: var(--ju-ink); --jum: var(--ju-copy); --jublue: var(--ju-link);
  --bs-body-bg: var(--ju-page); --bs-body-color: var(--ju-ink);
  --bs-heading-color: var(--ju-ink); --bs-emphasis-color: var(--ju-ink);
  --bs-secondary-color: var(--ju-copy); --bs-tertiary-color: var(--ju-dim);
  --bs-border-color: var(--ju-line); --bs-link-color: var(--ju-link); --bs-link-hover-color: #452664;
}
html[data-ju-theme="light"] body,
html[data-ju-theme="light"] #wrapwrap {
  background: var(--ju-page) !important; color: var(--ju-ink) !important;
}

/* Shared Odoo pages: shop, account, helpdesk, jobs and thank-you forms.
   Appointment surfaces use their own matching light tokens below. */
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(main,#wrap) { color: var(--ju-ink) !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.text-body,.text-dark,.text-black,.text-reset):not(.company-img-wrap *,.svc-media *,.gal figure *,.stage *,.carwrap *,.lbview *,.ju-shots *,.band *) { color: var(--ju-ink) !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(p,small,.small,.text-muted,.text-secondary,.text-body-secondary,.fw-light):not(.company-img-wrap *,.svc-media *,.gal figure *,.stage *,.carwrap *,.lbview *,.ju-shots *,.band *) { color: var(--ju-copy) !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(label,.form-label,.col-form-label,legend,.form-check-label,.s_website_form_label_content) { color: var(--ju-ink) !important; }
html[data-ju-theme="light"] #wrapwrap .s_website_form_mark { color: var(--ju-negative) !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(.form-control,.form-select,.input-group-text,.js_quantity) {
  background-color: var(--ju-panel) !important; color: var(--ju-ink) !important; border-color: var(--ju-line-strong) !important;
}
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(input,textarea)::placeholder { color: var(--ju-dim) !important; opacity: 1; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(.form-control,.form-select):focus { border-color: var(--ju-link) !important; box-shadow: 0 0 0 3px rgba(96,65,138,.14) !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(select option,.card,.card-body,.card-header,.card-footer,.list-group-item,.accordion-item,.accordion-button,.modal-content,.dropdown-menu,.offcanvas) {
  background-color: var(--ju-panel) !important; color: var(--ju-ink) !important; border-color: var(--ju-line) !important;
}
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(.bg-white,.bg-light,.bg-100,.bg-200,.bg-body,.bg-body-tertiary) {
  background-color: var(--ju-panel-alt) !important; color: var(--ju-ink) !important;
}
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap .dropdown-item { color: var(--ju-ink) !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap .dropdown-item:is(:hover,:focus) { background: var(--ju-panel-alt) !important; color: var(--ju-link) !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(.btn-light,.btn-secondary,.btn-outline-secondary,.page-link,.js_add_cart_json,.o_print_btn) {
  background: var(--ju-panel) !important; color: var(--ju-ink) !important; border-color: var(--ju-line-strong) !important;
}
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap .btn-primary {
  background: #262b4b !important; color: #ffffff !important; border-color: #262b4b !important; box-shadow: var(--ju-shadow) !important;
}
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap .btn-primary * { color: inherit !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(.table,.table th,.table td) {
  --bs-table-bg: transparent; --bs-table-color: var(--ju-ink); --bs-table-striped-bg: var(--ju-panel-alt); --bs-table-striped-color: var(--ju-ink);
  color: var(--ju-ink) !important; border-color: var(--ju-line) !important;
}
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(.alert,.o_address_signin,#helpdesk_section) {
  background: var(--ju-panel-alt) !important; color: var(--ju-ink) !important; border-color: var(--ju-line-strong) !important; box-shadow: var(--ju-shadow);
}
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(.badge.bg-light,.badge.text-bg-light) { background: #eee5d2 !important; color: var(--ju-accent) !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(.text-success,.alert-success) { color: var(--ju-positive) !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(.text-danger,.alert-danger,.invalid-feedback) { color: var(--ju-negative) !important; }
html[data-ju-theme="light"]:not(.ju-bk) #wrapwrap :is(a,button,input,select,textarea,[tabindex]):focus-visible { outline: 2px solid var(--ju-link); outline-offset: 3px; }

/* Main site, partnership pages, global navigation and footer. */
html[data-ju-theme="light"] #ju-root { background-color: var(--ju-page) !important; color: var(--ju-ink) !important; }
html[data-ju-theme="light"] #ju-root :is(.nav,.nav.scrolled,.nav-links) { background: rgba(208,201,191,.97) !important; border-color: var(--ju-line) !important; }
html[data-ju-theme="light"] #ju-root #nav a:not(.nav-cta):not(.nav-ticket):not(.nav-login) { color: var(--ju-ink) !important; }
html[data-ju-theme="light"] #ju-root #nav :is(.nav-ticket,.nav-login,.lang-btn) { color: var(--ju-ink) !important; border-color: var(--ju-line-strong) !important; }
html[data-ju-theme="light"] #ju-root :is(.nav-cta,.nav-ticket:hover,.nav-login:hover,.pp-btn,.btn-primary) { background: #262b4b !important; color: #ffffff !important; }
html[data-ju-theme="light"] #ju-root :is(.hero,.trust-bar,.about,.companies,.products,.hero-product,.factory,.b2b,.certs,.contact,.footer) {
  background-color: var(--ju-page) !important; background-image: none !important; border-color: var(--ju-line) !important;
}
html[data-ju-theme="light"] #ju-root :is(.companies,.hero-product,.b2b,.footer) { background-color: var(--ju-page-alt) !important; }
html[data-ju-theme="light"] #ju-root :is(.hero-stats,.hero-eyebrow,.company-card,.product-card,.hp-feat,.pp-card,.pp-form,.pp-step,.pp-fact,.lf-panel,.contact-card) {
  background: var(--ju-panel) !important; border-color: var(--ju-line) !important; box-shadow: var(--ju-shadow) !important;
}
html[data-ju-theme="light"] #ju-root :is(.gradient-text,.hero-line-2) {
  background: none !important; color: var(--ju-link) !important; -webkit-text-fill-color: currentColor !important;
}
html[data-ju-theme="light"] #ju-root :is(.company-name,.footer-title,.section-title,.hero-title,.pp-title) { color: var(--ju-ink) !important; }
html[data-ju-theme="light"] #ju-root :is(.footer-col ul li a,.footer-staff,.lf-copy,.ju-logo-family figcaption) { color: var(--ju-copy) !important; border-color: var(--ju-line) !important; }
html[data-ju-theme="light"] #ju-root .footer-name { color: var(--ju-accent) !important; }
/* Show the unchanged source logos at full clarity on the light brand panel. */
html[data-ju-theme="light"] #ju-root .ju-logo-family img { opacity: 1 !important; filter: none !important; }
html[data-ju-theme="light"] #ju-root :is(.trust-chip,.product-tag,.hero-eyebrow,.btn-ghost,.swatch-more) { color: var(--ju-accent) !important; background: #e0d3ba !important; border-color: #b49c70 !important; }
html[data-ju-theme="light"] #ju-root .company-badge { background: rgba(14,18,48,.88) !important; color: #f4d77a !important; }
html[data-ju-theme="light"] :is(.ju-stars,.ju-nebula,.ju-aurora) { opacity: .18; }
html[data-ju-theme="light"] #ju-root .ju-motes { opacity: .3; }
html[data-ju-theme="light"] #ju-root .ju-comet { opacity: .65; }
/* The appointment landing photograph is intentionally a dark island. The old
   booking-wide heading rule uses the light-page ink and needs this exception. */
html[data-ju-theme="light"].ju-bk #ju-lp .ju-lp-hero .ju-lp-h1 { color: #ffffff !important; }
html[data-ju-theme="light"].ju-bk #ju-lp .ju-lp-hero .ju-lp-chk-link { color: #f4d77a !important; }
/* The legacy #wrapwrap select background shorthand outranks the booking
   form-select rule. Match the real timezone ID and restore a single arrow. */
html[data-ju-theme].ju-bk :is(#timezone,#select_timezone) {
  background-image: var(--bk-arrow) !important;
  background-repeat: no-repeat !important; background-size: 16px 12px !important;
  background-position: right 14px center !important;
  padding-right: 40px !important; padding-left: 14px !important;
}
html[data-ju-theme].ju-bk[dir="rtl"] :is(#timezone,#select_timezone) {
  background-position: left 14px center !important;
  padding-left: 40px !important; padding-right: 14px !important;
}
html[data-ju-theme="light"].ju-bk :is(#timezone,#select_timezone) {
  background-color: var(--ju-panel) !important; color: var(--ju-ink) !important; border-color: var(--ju-line-strong) !important;
}
html[data-ju-theme="light"].ju-bk :is(#timezone,#select_timezone) option { background: var(--ju-panel) !important; color: var(--ju-ink) !important; }
html[data-ju-theme="light"].ju-bk .o_appointment_timezone_selection label { color: var(--ju-copy) !important; }
/* Replace legacy white booking cards and fields with the same stone/champagne
   hierarchy. Selected days, time slots and the photographic hero keep their
   existing state-specific colours and artwork. */
html[data-ju-theme="light"].ju-bk {
  --bk-bg: var(--ju-page); --bk-bg-top: var(--ju-page-alt);
  --bk-glow: rgba(162,125,63,.12);
  --bk-card: var(--ju-panel); --bk-cardgrad: linear-gradient(180deg,#eee9e0 0%,#e3dbcf 100%);
  --bk-text: var(--ju-ink); --bk-muted: var(--ju-copy); --bk-dim: var(--ju-dim);
  --bk-gold: var(--ju-accent); --bk-line: var(--ju-line); --bk-line2: var(--ju-line-strong);
  --bk-field: var(--ju-panel); --bk-chip: var(--ju-panel-alt); --bk-chip2: #d9ccb5;
  --bk-price: linear-gradient(120deg,#ded1b6 0%,#e3dbcf 62%); --bk-price-line: #b49c70;
  --bk-ok: var(--ju-positive); --bk-err: var(--ju-negative);
  --bk-shadow: var(--ju-shadow);
}
html[data-ju-theme="light"].ju-bk #calendar .o_slot_button:not(.d-none):not(.o_slot_selected):not(.active):not(:hover) { background: var(--ju-panel-alt) !important; }
html[data-ju-theme="light"].ju-bk #ju-lp :is(.ju-lp-prices,.ju-lp-specs > div,.ju-lp-one-res,.ju-lp-chk-out.none) { background: var(--ju-panel-alt); }
html[data-ju-theme="light"].ju-bk #ju-lp .ju-lp-tagline { color: var(--ju-accent); }

/* Page-local palettes: preserve each page's layout and its product artwork. */
html[data-ju-theme="light"] #ju-svc { --t: var(--ju-ink); --m: var(--ju-copy); --bd: var(--ju-line); --cardbg: var(--ju-panel); color: var(--ju-ink); }
html[data-ju-theme="light"] #ju-svc .svc-btn-primary { background: #262b4b !important; color: #fff !important; }
html[data-ju-theme="light"] #ju-svc :is(.svc-card,.svc-trust-item,.svc-faq-item) { box-shadow: var(--ju-shadow); }
html[data-ju-theme="light"] #ju-svc .svc-grad { background: none !important; color: var(--ju-link) !important; -webkit-text-fill-color: currentColor !important; }
html[data-ju-theme="light"] :is(#juabout,#jucontact,#jupapers,#jucontact-form,#jupolicies,#juans) { background: var(--ju-page) !important; color: var(--ju-ink) !important; }
html[data-ju-theme="light"] :is(#juabout,#jucontact,#jupapers) h1 b { background: none !important; color: var(--ju-link) !important; -webkit-text-fill-color: currentColor !important; }
html[data-ju-theme="light"] :is(#juabout .arm,#juabout .sp,#juabout .why li,#jucontact .cd,#jupapers .hit,#jupapers .card,#jupapers .f,#jupolicies .idbox) {
  background: var(--ju-panel) !important; color: var(--ju-ink) !important; border-color: var(--ju-line) !important; box-shadow: var(--ju-shadow);
}
html[data-ju-theme="light"] :is(#juabout .tag,#juabout .lead b,#juabout .why li b,#jucontact .cd h4,#jupapers .hit .amt,#jupapers .card h3,#jupolicies h1,#jupolicies h2,#jupolicies a) { color: var(--ju-accent) !important; }
html[data-ju-theme="light"] :is(#juabout .ctas a.sh,#jucontact .ctas a.sh,#jupapers .d2,#jupapers .d3,#jupapers .d4) { background: var(--ju-panel) !important; color: var(--ju-link) !important; border-color: var(--ju-line-strong) !important; }
html[data-ju-theme="light"] :is(#juabout .arm a,#jupapers .hit .no) { color: var(--ju-link) !important; }
html[data-ju-theme="light"] :is(#juabout .legal,#jucontact .or,#jupapers .f b,#jupapers .signrow a) { color: var(--ju-dim) !important; }
html[data-ju-theme="light"] :is(#jupapers .hit .who,#jupapers .f span,#jupolicies li) { color: var(--ju-ink) !important; }
html[data-ju-theme="light"] #jupapers input { background: var(--ju-panel) !important; color: var(--ju-ink) !important; border-color: var(--ju-line-strong) !important; }
html[data-ju-theme="light"] #jupapers .warn { background: #fcebf0 !important; color: var(--ju-negative) !important; }
html[data-ju-theme="light"] #jupapers .st.paid { background: #e6f3eb !important; color: var(--ju-positive) !important; }
html[data-ju-theme="light"] #jupapers .st.unpaid { background: #fcebf0 !important; color: var(--ju-negative) !important; }
html[data-ju-theme="light"] #juans { --bg: var(--ju-page); --navy: var(--ju-page-alt); --card: var(--ju-panel); --g1: var(--ju-accent); --g2: var(--ju-accent); --tx: var(--ju-ink); --mu: var(--ju-copy); --ln: var(--ju-line); }
html[data-ju-theme="light"] #juans :is(.pt td,.qa) { border-color: var(--ju-line) !important; }
html[data-ju-theme="light"] #juans .pt .nm .t { color: var(--ju-ink) !important; }
html[data-ju-theme="light"] #juans .btn-g { background: #262b4b !important; color: #fff !important; }

/* The colour simulator keeps all paint variables, swatches, photography and
   its photographic-stage scrim unchanged; only its surrounding UI changes. */
html[data-ju-theme="light"] #juclr {
  --navy: var(--ju-page); --deep: var(--ju-page-alt); --card: var(--ju-panel); --card2: var(--ju-panel-alt);
  --line: var(--ju-line); --gold: var(--ju-accent); --gold2: var(--ju-accent);
  --text: var(--ju-ink); --muted: var(--ju-copy); --faint: var(--ju-dim); --goldgrad: linear-gradient(180deg,#303657,#171c38);
}
html[data-ju-theme="light"] #juclr .btn-gold { color: #fff !important; box-shadow: var(--ju-shadow); }
html[data-ju-theme="light"] #juclr .btn-ghost { color: var(--ju-accent) !important; border-color: #9a7c35 !important; background: transparent !important; }
html[data-ju-theme="light"] #juclr .btn-ghost:hover { background: #e0d3ba !important; }
/* The photographic preview stays navy in either mode. Its own controls and
   explanatory caption need light text independently of the page palette. */
html[data-ju-theme="light"] #juclr .stagebar .rnd { color: #f4d77a !important; }
html[data-ju-theme="light"] #juclr .stagebar .tag { color: #c4cbdd !important; }
html[data-ju-theme="light"] #juclr :is(.pill .in,.lbpanel,.lbclose) { background: var(--ju-panel) !important; color: var(--ju-ink) !important; border-color: var(--ju-line-strong) !important; box-shadow: var(--ju-shadow); }
html[data-ju-theme="light"] #juclr :is(.badge.magic,.fb.on) { color: var(--ju-link) !important; background: #eee6f7 !important; }

/* Wholesale and offers retain JU1 purple over warm tonal surfaces. */
html[data-ju-theme="light"] :is(#jusupply,#juc2) {
  --bg: var(--ju-page); --bg2: var(--ju-page-alt); --card: var(--ju-panel); --card2: var(--ju-panel-alt);
  --line: var(--ju-line); --text: var(--ju-ink); --muted: var(--ju-copy); --faint: var(--ju-dim);
  --gold: var(--ju-accent); --gold2: var(--ju-accent); --goldhi: var(--ju-accent); --ok: var(--ju-positive); --bad: var(--ju-negative);
  --goldgrad: linear-gradient(180deg,#303657,#171c38);
}
html[data-ju-theme="light"] #jushopoffers {
  --ju-bg: var(--ju-page); --ju-bg-2: var(--ju-page-alt); --ju-card: var(--ju-panel); --ju-card-2: var(--ju-panel-alt);
  --ju-line: #bdb4a5; --ju-text: var(--ju-ink); --ju-muted: var(--ju-copy); --ju-faint: var(--ju-dim);
  --ju-gold: var(--ju-accent); --ju-gold-2: var(--ju-accent);
}
html[data-ju-theme="light"] #jushopoffers .ju-hero h1 { color: var(--ju-ink) !important; -webkit-text-fill-color: currentColor !important; background: none !important; }
html[data-ju-theme="light"] #jushopoffers .ju-nav { background: rgba(208,201,191,.97) !important; }
html[data-ju-theme="light"] #jushopoffers .ju-section-tag { color: #694098 !important; background: #f0e8f6 !important; }
html[data-ju-theme="light"] #jushopoffers .ju-price-card.featured::before { background: #ead6a8 !important; color: #332507 !important; }
html[data-ju-theme="light"] #jushopoffers .ju-cta-alt:hover { color: #694098 !important; }
/* Legacy hardcoded dark stops survived the light tokens below the offers. */
html[data-ju-theme="light"] #jushopoffers .ju-why { background: var(--ju-page-alt) !important; }
html[data-ju-theme="light"] #jushopoffers .ju-mfg {
  background: var(--ju-panel) !important; border-color: var(--ju-line) !important; box-shadow: var(--ju-shadow);
}
html[data-ju-theme="light"] #juc2 :is(.answer,.pbox,.note,section.s.alt) { background: var(--ju-panel-alt) !important; color: var(--ju-ink) !important; border-color: var(--ju-line) !important; }
html[data-ju-theme="light"] #juc2 :is(.pbox .pu,.q p,.card p,.steps li p) { color: var(--ju-copy) !important; }
html[data-ju-theme="light"] #juc2 .btn.gold { background: #262b4b !important; color: #fff !important; }
html[data-ju-theme="light"] #juc2 .band { background: #4a0e52 !important; }
html[data-ju-theme="light"] #juc2 .band :is(h2,p,.btn.ghost) { color: #fff !important; }
html[data-ju-theme="light"] #jusupply :is(.retail,.stat,.samples,.wcard,.juq-box,.pane,.formwrap,.jt) { background: var(--ju-panel) !important; border-color: var(--ju-line) !important; box-shadow: var(--ju-shadow); }
/* Only the full-page decorative warehouse receives a light wash. Actual roll
   and product photographs remain untouched in their own media containers. */
html[data-ju-theme="light"] #juwhbg { background: var(--ju-page) !important; }
html[data-ju-theme="light"] #juwhbg .veil { background: rgba(221,216,208,.96) !important; }
html[data-ju-theme="light"] #jushipping .bgfade { background: linear-gradient(180deg,#ddd8d0,rgba(221,216,208,.96) 35%,rgba(221,216,208,.96) 65%,#ddd8d0) !important; }
html[data-ju-theme="light"] #jusupply .btn-ghost { color: var(--ju-accent) !important; border-color: #9a7c35 !important; }
html[data-ju-theme="light"] #jusupply :is(.btn-gold,.rbtn,.milchip.big,.st-plus5) { color: #fff !important; }
html[data-ju-theme="light"] #jusupply :is(.ppre,.mpre,.qpre,.sochip.pre,.hvis .tag) { color: var(--ju-accent) !important; }
html[data-ju-theme="light"] #jusupply .hvis .tag { background: rgba(238,233,224,.96) !important; }
html[data-ju-theme="light"] #jusupply :is(.hint,.bnpl-logos .pml) { color: var(--ju-copy) !important; }
html[data-ju-theme="light"] #jusupply :is(.sochip,.geochip.err,.vatchip.bad,.node.dim::after) { color: var(--ju-negative) !important; }
html[data-ju-theme="light"] #jubar .inner { background: rgba(238,233,224,.97) !important; color: var(--ju-ink) !important; border-color: var(--ju-line-strong) !important; box-shadow: var(--ju-shadow); }
html[data-ju-theme="light"] #jubar .prog { background: var(--ju-line) !important; }
html[data-ju-theme="light"] #jumodal :is(.mpanel,.mclose) { background: var(--ju-panel) !important; color: var(--ju-ink) !important; border-color: var(--ju-line-strong) !important; }
html[data-ju-theme="light"] #jumodal :is(.mprice b,.mbest b,.specs th,.mwarr) { color: var(--ju-accent) !important; }
html[data-ju-theme="light"] #jumodal :is(.mdesc,.specs td) { color: var(--ju-ink) !important; }
html[data-ju-theme="light"] #jumodal :is(.mprice small,.mbest) { color: var(--ju-copy) !important; }
/* Legacy inline invoice lookup page: visual styling only; inputs and requests unchanged. */
html[data-ju-theme="light"] #wrap:has(#mi_inv) { background: var(--ju-page) !important; }
html[data-ju-theme="light"] #wrap:has(#mi_inv) > div > div { background: var(--ju-panel) !important; border-color: var(--ju-line) !important; box-shadow: var(--ju-shadow) !important; }
html[data-ju-theme="light"] #wrap:has(#mi_inv) h1 span { background: none !important; color: var(--ju-link) !important; -webkit-text-fill-color: currentColor !important; }
html[data-ju-theme="light"] :is(#mi_inv,#mi_ph) { background: var(--ju-panel) !important; color: var(--ju-ink) !important; border-color: var(--ju-line-strong) !important; }
html[data-ju-theme="light"] #mi_btn { background: #262b4b !important; color: #fff !important; }
}

/* The tall JU One source stays proportional inside a stable header hit area. */
@media screen {
  #nav .nav-logo { width: 44px !important; height: 44px !important; min-width: 44px; padding: 0 !important; gap: 0; align-items: center; justify-content: center; flex: 0 0 44px; }
  #nav .nav-logo > img.is-one { display: block; width: auto !important; height: 34px !important; max-width: 100%; max-height: 34px; margin: 0 !important; aspect-ratio: 147 / 420; object-fit: contain !important; object-position: center; flex: 0 0 auto; }
}
/* Collapse before the full English navigation can run beyond tablet edges. */
@media screen and (max-width: 1024px) {
  #ju-root #nav .nav-inner { width: 100%; box-sizing: border-box; }
  html[data-ju-theme="light"] #ju-root #nav .nav-links { background: #d0c9bf !important; }
  html[data-ju-theme="dark"] #ju-root #nav .nav-links { background: #07091c !important; }
  #ju-root #nav .nav-links { position: fixed; top: 72px; left: 0; right: 0; flex-direction: column; gap: 0; padding: 20px var(--pad); border-bottom: 1px solid var(--border); transform: translateY(-110%); visibility: hidden; max-height: calc(100dvh - 72px); overflow-y: auto; transition: transform .3s ease, visibility 0s .3s; }
  #ju-root #nav .nav-links.open { transform: translateY(0); visibility: visible; transition: transform .3s ease, visibility 0s; }
  #ju-root #nav .nav-links > li { width: 100%; border-bottom: 1px solid var(--border); }
  #ju-root #nav .nav-links > li:last-child { border-bottom: 0; }
  #ju-root #nav .nav-links a { display: block; padding: 14px 0; font-size: 15px; }
  #ju-root #nav .menu-btn { display: flex; }
  #ju-root #nav .nav-cta { display: none; }
  #ju-root #nav .nav-links .nav-more > .more-panel { position: static; box-shadow: none; background: transparent; border: 0; padding: 4px 0 4px 10px; min-width: 0; }
}
@media screen and (prefers-reduced-motion: reduce) {
  #ju-root #nav .nav-links, #ju-root #nav .nav-links.open { transition: none; }
}