/* Shared English theme. Loaded last by the base template, not by individual pages.
   Paint/type only: existing layout, logo and motion engines remain unchanged. */
html[data-site-version] body {
  --ink: var(--jyh-page-text);
  --muted: var(--jyh-page-muted);
  --accent: var(--jyh-page-accent);
  --brand: var(--jyh-page-accent-hover);
  --line: var(--jyh-page-border);
  --line-strong: var(--jyh-page-border);
  --card-surface: var(--jyh-panel-surface);
  --card-border: var(--jyh-page-border);
  --card-shadow: var(--jyh-page-shadow);
  color-scheme: light;
  background: var(--jyh-page-surface);
  color: var(--jyh-page-text);
  font-family: var(--jyh-type-family);
  font-synthesis: none;
}
/* Opt-in only: templates that put contact-atmosphere on <body> paint the field.
   No other page shares it, so the flat page surface stays untouched. */
html[data-site-version] body.contact-atmosphere {
  background-color: var(--jyh-atmosphere-base);
  background-image: var(--jyh-atmosphere-layers);
  background-position: top right;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}
html[data-site-version] body :is(h1,h2,h3,h4,h5,h6,a,button,input,select,textarea,summary,table,
  .site-navigation,.es-page,.product-search-form,.search-panel-title,.hero-copy-display) {
  font-family: var(--jyh-type-family);
  font-synthesis: none;
}
html[data-site-version] body :is(h1,h2,h3,h4,h5,h6) { font-weight: var(--jyh-type-heading-weight); }
/* Keep the nine-column table geometry. Long key-parameter labels may wrap
   within their original column; ordinary and accuracy headers stay intact. */
html[data-site-version] body .es-table thead th {
  font-weight: var(--jyh-type-table-heading-weight);
  letter-spacing: var(--jyh-type-table-heading-tracking);
}
html[data-site-version] body .es-table thead th:nth-child(6) .es-table-header-label {
  white-space: normal;
  line-height: var(--jyh-line-table-heading);
}
html[data-site-version] body .hero-title-liquid,
html[data-site-version] body .hero-title-liquid span:nth-child(n) {
  font-family: var(--jyh-type-hero-family);
  font-weight: var(--jyh-type-hero-weight);
  letter-spacing: var(--jyh-type-hero-tracking);
  line-height: var(--jyh-line-hero);
  filter: none;
}
html[data-site-version] body .hero-copy-display {
  font-family: var(--jyh-type-hero-family);
  font-weight: var(--jyh-type-hero-weight);
  letter-spacing: var(--jyh-type-copy-tracking);
  line-height: var(--jyh-line-copy);
}
/* Dark chrome and dark application cards are intentional, with their own ink. */
html[data-site-version] body :is(.site-header,.site-footer) {
  --ink: var(--jyh-chrome-text);
  --muted: var(--jyh-chrome-muted);
  --accent: var(--jyh-chrome-accent);
  --brand: var(--jyh-chrome-text);
  color-scheme: dark;
  background: var(--jyh-chrome-surface);
  color: var(--jyh-chrome-text);
}
html[data-site-version] body .scenario-card {
  --ink: var(--jyh-chrome-text);
  --muted: var(--jyh-chrome-muted);
  --jyh-color-text: var(--jyh-chrome-text);
  --jyh-color-muted: var(--jyh-chrome-muted);
  --jyh-card-surface: var(--jyh-navy-card-surface);
  background: var(--jyh-navy-card-surface);
  border-color: var(--jyh-navy-card-border);
  box-shadow: var(--jyh-navy-card-shadow);
  color: var(--jyh-chrome-text);
}
html[data-site-version] body .site-footer { color: var(--muted); border-color: var(--jyh-navy-card-border); }
html[data-site-version] body :is(.page-intro,.section-muted) { background: none; border-color: var(--jyh-page-border); }
html[data-site-version] body :is(.category-card,.product-card,.es-product,
  .contact-form,.category-filter,.catalogue-tree,.download-item) {
  background: var(--jyh-panel-surface);
  border-color: var(--jyh-page-border);
  box-shadow: var(--jyh-page-shadow);
  color: var(--jyh-page-text);
}
html[data-site-version] body :is(.product-media,.product-media .image-placeholder,.image-placeholder) {
  background: var(--jyh-subtle-surface);
  border-color: var(--jyh-page-border);
  color: var(--jyh-page-muted);
  box-shadow: var(--jyh-page-shadow);
}
/* Contact information uses the same navy material as application cards.
   Local semantic ink roles cover nested names, addresses, labels and links. */
html[data-site-version] body .contact-card {
  --ink: var(--jyh-chrome-text);
  --muted: var(--jyh-chrome-muted);
  --accent: var(--jyh-chrome-accent);
  --brand: var(--jyh-chrome-text);
  --line: var(--jyh-navy-card-border);
  color-scheme: dark;
  background: var(--jyh-navy-card-surface);
  color: var(--ink);
  border-color: var(--line);
  box-shadow: var(--jyh-navy-card-shadow-deep);
}
html[data-site-version] body .contact-card .sales-contact-card {
  background: var(--jyh-navy-inset-surface);
  border-color: var(--line);
  box-shadow: var(--jyh-navy-card-shadow);
}
html[data-site-version] body :is(.product-title-frequency,.product-title-power,
  .contact-card-header h2,.contact-address-block strong,.sales-contact-card h3,
  .contact-details-list dd,.sales-contact-details dd,.contact-field label,
  .download-item strong,.catalogue-tree-heading,.filter-link) { color: var(--ink); }
html[data-site-version] body :is(.contact-section-label,.contact-address-note,.sales-contact-role,
  .contact-details-list dt,.sales-contact-details dt,.download-item small) { color: var(--muted); }
html[data-site-version] body :is(.product-media-column .back-link,.product-detail-copy > .eyebrow,
  .product-model,.contact-details-list a,.sales-contact-details a,.contact-field label span,
  .download-item-icon,.download-item-action,.product-document-link,.pagination a,
  .catalogue-current-level > p,.catalogue-tree .filter-link span,.catalogue-tree .filter-link i,
  .catalogue-flyout i) { color: var(--accent); }
html[data-site-version] body :is(.contact-details-list a,.sales-contact-details a,.product-document-link):is(:hover,:focus-visible) {
  color: var(--brand); text-shadow: none;
}
html[data-site-version] body :is(.contact-company-panel,.contact-address-block,.sales-contact-details > div,
  .product-model,.product-model-row,.product-title-divider) { border-color: var(--line); }
html[data-site-version] body .account-card h1 { white-space: normal; }
html[data-site-version] body main :is(.form-field input,.contact-field input,.contact-field textarea,
  .product-search-form input,.product-search-form select) {
  background: var(--jyh-panel-surface);
  border-color: var(--jyh-page-border);
  color: var(--jyh-page-text);
  box-shadow: none;
}
html[data-site-version] body main :is(input,textarea)::placeholder { color: var(--jyh-page-muted); }
html[data-site-version] body main :is(.form-field input,.contact-field input,.contact-field textarea,
  .product-search-form input,.product-search-form select):focus {
  background: var(--jyh-panel-surface);
  border-color: var(--jyh-page-accent);
  box-shadow: var(--jyh-page-focus);
}
/* Filled actions share one material. Disclosure arrows and field/listbox controls
   keep their existing semantic treatment; no layout or typography changes. */
html[data-site-version] body button { box-shadow: none; }
html[data-site-version] body :is(.button,.account-primary,.es-apply button,
  .language-link,.account-link,.download-item,.search-pagination a,.pagination a,
  .product-detail-download:not(.is-pending),.es-table-download:not(.is-pending)) {
  background: var(--jyh-action-surface); border-color: var(--jyh-action-border);
  color: var(--jyh-action-text); box-shadow: var(--jyh-action-shadow);
}
html[data-site-version] body :is(.button,.account-primary,.es-apply button,
  .language-link,.account-link,.download-item,.search-pagination a,.pagination a,
  .product-detail-download:not(.is-pending),.es-table-download:not(.is-pending)):is(:hover,:focus-visible) {
  background: var(--jyh-action-hover-surface); border-color: var(--jyh-action-border);
  color: var(--jyh-action-text); box-shadow: var(--jyh-action-shadow);
}
html[data-site-version] body .download-item :is(.download-item-copy strong,.download-item-copy small,.download-item-icon,.download-item-action) {
  color: var(--jyh-action-text);
}
html[data-site-version] body :is(.account-notice,.search-notice,.product-detail-download.is-pending) {
  background: var(--jyh-page-selected); border-color: var(--jyh-page-border); color: var(--jyh-page-accent);
}
html[data-site-version] body .product-detail-download.is-pending { color: var(--jyh-page-muted); }
html[data-site-version] body :is(.form-error,.contact-form-errors,.search-errors,.search-no-results) {
  color: var(--jyh-page-error-text); border-color: var(--jyh-page-error-border);
}
html[data-site-version] body :is(.contact-form-errors,.search-errors,.search-no-results) { background: var(--jyh-page-error-surface); }
html[data-site-version] body .contact-success { background: var(--jyh-page-success-surface); color: var(--jyh-page-success-text); }
html[data-site-version] body .contact-success span { color: var(--jyh-page-success-text); }
html[data-site-version] body .contact-consent input { accent-color: var(--jyh-page-accent); }
html[data-site-version] body main :is(.catalogue-search .product-search-form,.catalogue-flyout) {
  background: var(--jyh-panel-surface); border-color: var(--jyh-page-border); color: var(--jyh-page-text);
}
html[data-site-version] body main :is(.catalogue-flyout a,.catalogue-flyout button,.catalogue-tree a) { color: var(--jyh-page-text); }
html[data-site-version] body main :is(.filter-link,.catalogue-flyout a):is(:hover,.is-active) { background: var(--jyh-page-selected); color: var(--jyh-page-accent); }
html[data-site-version] body :is(.category-card,.product-card,.es-product,.download-item):is(:hover,:focus-visible) {
  background: var(--jyh-page-hover); border-color: var(--jyh-page-accent); box-shadow: var(--jyh-page-shadow);
}
html[data-site-version] body .product-media-column .back-link:is(:hover,:focus-visible) {
  color: var(--jyh-page-accent-hover); text-shadow: none;
}
/* Restore the pre-light-theme account material for login/register/verification.
   The shared page canvas stays light; form logic and geometry are untouched. */
html[data-site-version] body .account-card {
  --ink: var(--jyh-chrome-text);
  --muted: var(--jyh-chrome-muted);
  --accent: var(--jyh-chrome-accent);
  --brand: var(--jyh-chrome-text);
  color-scheme: dark;
  color: var(--ink);
  background: var(--jyh-account-surface);
  border-color: var(--jyh-navy-card-border);
  box-shadow: var(--jyh-account-shadow);
}
html[data-site-version] body .account-card .form-field input {
  background: var(--jyh-account-control-surface);
  border-color: var(--jyh-account-control-border);
  color: var(--ink);
  box-shadow: var(--jyh-account-control-shadow);
}
html[data-site-version] body .account-card .form-field input:focus {
  background: var(--jyh-account-control-focus-surface);
  border-color: var(--jyh-account-control-focus-border);
  box-shadow: var(--jyh-account-control-shadow);
}
html[data-site-version] body .account-card input::placeholder { color: var(--muted); }
html[data-site-version] body .account-card .account-notice {
  background: var(--jyh-account-notice-surface);
  border-color: var(--accent);
  color: var(--ink);
}
html[data-site-version] body .account-card .form-error { color: var(--jyh-account-error-text); }
/* The account card is a dark surface, so its filled action inverts to the light
   material; the shared dark action would otherwise sit invisible on it. */
html[data-site-version] body .account-card :is(.button,.button-primary,.account-primary) {
  background: linear-gradient(180deg, var(--jyh-panel-surface) 0%, var(--jyh-page-selected) 100%);
  border-color: var(--jyh-chrome-text);
  color: var(--jyh-page-text);
}
html[data-site-version] body .account-card :is(.button,.button-primary,.account-primary):is(:hover,:focus-visible) {
  background: linear-gradient(180deg, var(--jyh-panel-surface) 0%, var(--jyh-page-hover) 100%);
  border-color: var(--jyh-chrome-text);
  color: var(--jyh-page-text);
}
@media (max-width: 900px) {
  html[data-site-version] body .site-navigation { background: var(--jyh-chrome-surface); }
}