/* Shared catalogue surfaces, derived from the approved original home page.
   The home consumes only the shared platform-button tokens below; the root
   exclusion keeps every other home surface under its existing home styles.
   Only page chrome and named catalogue components belong to this layer; embedded
   editors, document previews, code, typography and layout grids remain native. */
@layer catalog-visual-system {
 /* The same platform-button intensities serve the home and product pages. */
 body.office-catalog-dle {
  --catalog-os-fill:13%;
  --catalog-os-hover-fill:20%;
  --catalog-os-pressed-fill:25%;
  --catalog-os-line:33%;
  --catalog-os-hover-line:46%;
  --catalog-os-pressed-line:54%;
  --catalog-os-muted:#4f5966;
 }
 body.office-catalog-dle:not(:has(.catalog-home-page)) {
  --cvs-paper:#fffefd;
  --cvs-ink:#27272e;
  --cvs-muted:#616169;
  --cvs-surface:#f8f9fc;
  --cvs-line:rgba(35,45,40,.047);
  --cvs-section-line:rgba(35,45,40,.11);
  --cvs-faq-line:rgba(35,45,40,.075);
  --cvs-frame-max:var(--balanced-content-width,1280px);
  --cvs-gutter:var(--balanced-content-gutter,24px);
  --cvs-inner-inset:var(--balanced-inner-inset,20px);
  --cvs-axis:calc(max(var(--cvs-gutter),(100% - var(--cvs-frame-max)) / 2) + var(--cvs-inner-inset));
  background:var(--cvs-paper)!important;

  /* Shared chrome retains each app's navigation colour and current marker. */
  & > header.office-header {
   background:var(--cvs-paper)!important;
   border-color:transparent!important;
   border-bottom-color:color-mix(in srgb,var(--header-page-brand,var(--catalog-office-brand)) 36%,var(--cvs-paper))!important;
   border-image:none!important;
   box-shadow:none!important;
  }
  & > header.office-header :is(.header-catalog-panel,.header-catalog-section,.header-catalog-brand,.header-catalog-columns,.global-header,.header-version-grid a) {
   border-color:transparent!important;
   box-shadow:none!important;
  }
  & > header.office-header .header-app-grid a {
   background:color-mix(in srgb,var(--nav-brand) 6%,var(--cvs-paper))!important;
   border-color:color-mix(in srgb,var(--nav-brand) 20%,var(--cvs-paper))!important;
   box-shadow:none!important;
  }
  & > header.office-header .header-app-grid a:is(:hover,:focus-visible,[aria-current="page"]) {
   background:color-mix(in srgb,var(--nav-brand) 10%,var(--cvs-paper))!important;
   border-color:color-mix(in srgb,var(--nav-brand) 32%,var(--cvs-paper))!important;
  }
  & > header.office-header .header-app-grid a:focus-visible {
   outline:2px solid var(--nav-brand)!important;
   outline-offset:3px!important;
  }
  & > header.office-header .header-catalog-versions::before {
   background:none!important;
   box-shadow:none!important;
  }
  & > footer.footer {
   background:#f0efed!important;
   border-image:none!important;
   box-shadow:none!important;
  }
  & > footer.footer :is(.footer-grid,.footer-office-group,.legal) {
   border-color:transparent!important;
   box-shadow:none!important;
  }

  /* Resolve the theme at its owning main element. Informational sections have
     an Office accent; a legacy catalogue default is not an Excel identity. */
  & > main {
   --cvs-accent:var(--catalog-office-brand,#5b5fc7);
   --cvs-accent-ink:color-mix(in srgb,var(--cvs-accent) 82%,#253242);
   color:var(--cvs-ink)!important;
   background:var(--cvs-paper)!important;
  }
  & > main.product-page {
   --cvs-accent:var(--product-brand,var(--catalog-office-brand,#5b5fc7));
  }
  & > main:is(.app-detail-page,.office-versions-page) {
   --cvs-accent:var(--app-accent,var(--catalog-office-brand,#5b5fc7));
  }
  & > main:is(.catalog-editorial-page,.catalog-hub-page),
  & > main.catalog-product-page > .catalog-section {
   --catalog-accent:var(--catalog-office-brand,#5b5fc7)!important;
   --catalog-accent-rgb:91,95,199!important;
  }

  /* Full-width section frames share the header's useful content edge. Product
     hero grids keep their existing demo and download-column overhang. */
  & main > section:not(.hero) > .container,
  & main > .catalog-breadcrumbs,
  & main > .info-layout.container,
  & main .ov-container,
  & main.ov-page .catalog-breadcrumbs,
  & > .dle-system-content.container {
   width:calc(100% - var(--cvs-axis) * 2)!important;
   max-width:none!important;
   margin-inline:auto!important;
   padding-inline:0!important;
  }
  & main :is(.hero-copy h1,.section-heading h2,.section-head h2,.catalog-section-heading h2,.ov-page-head h2,.ov-intro h1,.ov-section-head h2,.platform-office-copy h1,.platform-office-heading h2,.catalog-hub-title h1,.catalog-article-header h1,.info-content > h1) {
   color:var(--cvs-ink)!important;
  }
  & main :is(.hero-copy h1 span,.catalog-aside h1,.system-requirements h2,.program-facts h2,.platform-office-card h2,.info-content h1,.info-content h2,.info-content h3,.release-id h3,.release-cell,.ov-year-block strong) { color:var(--cvs-ink)!important; }
  & main :is(.hero-title-secondary,.hero-description,.section-heading p,.section-head p,.catalog-section-heading p,.ov-intro-description,.ov-section-head p,.platform-office-copy > p,.platform-office-heading > p,.catalog-hub-title p,.catalog-article-lead,.catalog-card p,.catalog-source-panel p) {
   color:var(--cvs-muted)!important;
  }
  & main > :is(.hero,.platform-office-hero,.catalog-hub-hero,.ov-intro) {
   background:
    radial-gradient(ellipse 76% 78% at 13% 2%,color-mix(in srgb,var(--cvs-accent) 12%,var(--cvs-paper)) 0%,transparent 74%),
    radial-gradient(ellipse 65% 70% at 99% 39%,#eaf3fc 0%,transparent 75%),
    var(--cvs-paper)!important;
   border-color:transparent!important;
   border-image:none!important;
   box-shadow:inset 0 -1px 0 var(--cvs-line)!important;
  }
  & main > :is(.hero,.platform-office-hero,.catalog-hub-hero)::before,
  & main > :is(.hero,.platform-office-hero,.catalog-hub-hero)::after {
   background:none!important;
   box-shadow:none!important;
  }

  /* Outlined platform choices keep their existing sizes and all live labels. */
  & main .hero-os-actions .os-download {
   --cvs-os-accent:var(--os-accent,var(--cvs-accent));
   color:var(--cvs-ink)!important;
   background:color-mix(in srgb,var(--cvs-os-accent) var(--catalog-os-fill),white)!important;
   border-color:color-mix(in srgb,var(--cvs-os-accent) var(--catalog-os-line),white)!important;
   border-radius:4px!important;
   box-shadow:none!important;
   text-shadow:none!important;
  }
  & main .hero-os-actions .os-download strong { color:var(--cvs-ink)!important; }
  & main .hero-os-actions .os-download small { color:var(--catalog-os-muted)!important; opacity:1!important; }
  & main .hero-os-actions .os-download .download-icon { color:var(--cvs-os-accent)!important; }
  & main .hero-os-actions .os-download:is(:hover,:focus-visible) {
   color:var(--cvs-ink)!important;
   background:color-mix(in srgb,var(--cvs-os-accent) var(--catalog-os-hover-fill),white)!important;
   border-color:color-mix(in srgb,var(--cvs-os-accent) var(--catalog-os-hover-line),white)!important;
   box-shadow:none!important;
  }
  & main .hero-os-actions .os-download:active {
   background:color-mix(in srgb,var(--cvs-os-accent) var(--catalog-os-pressed-fill),white)!important;
   border-color:color-mix(in srgb,var(--cvs-os-accent) var(--catalog-os-pressed-line),white)!important;
  }
  & main .hero-os-actions .os-download::before { background:transparent!important; }
  & main .hero-os-actions .os-download:focus-visible { outline:2px solid var(--cvs-os-accent)!important; outline-offset:3px!important; }
  & main :is(.os-download-specs,.os-download-specs b,.hero-download-note) { color:var(--cvs-muted)!important; }

  /* Open sections alternate only broad, quiet surfaces. */
  & main > :is(.trust-strip,.program-facts,.system-requirements,.excel-capabilities,.catalog-section,.platform-office-catalog,.platform-office-guide,.ov-catalog,.ov-subscription,.ov-comparison,.download-return) {
   border-color:transparent!important;
   border-image:none!important;
   box-shadow:none!important;
  }
  & main > :is(.program-facts,.system-requirements,.catalog-section,.platform-office-catalog,.ov-catalog,.ov-comparison) { background:var(--cvs-paper)!important; }
  & main > .trust-strip { background:color-mix(in srgb,var(--cvs-accent) 6%,var(--cvs-paper))!important; box-shadow:inset 0 -1px 0 var(--cvs-section-line)!important; }
  & main > :is(.section-gray,.excel-capabilities,.platform-office-guide,.ov-subscription),
  & main > .catalog-section:nth-of-type(even) { background:var(--cvs-surface)!important; }
  & main :is(.trust-copy strong,.program-fact strong,.catalog-fact strong,.release-name strong,.release-title,.requirements-matrix-app,.excel-capability h3,.platform-office-card h3,.catalog-card h3,.info-sidebar h2,.info-sidebar h3) { color:var(--cvs-ink)!important; }
  & main :is(.trust-copy small,.program-fact span,.catalog-fact span,.release-name small,.release-meta,.requirements-matrix-note,.requirements-matrix-label-head,.excel-capability p,.platform-office-card p,.platform-office-card li,.info-sidebar p,.info-sidebar small) { color:var(--cvs-muted)!important; }
  & main :is(.release-id p,.release-cell small,.catalog-aside p,.info-content .catalog-article-body,.system-requirements-heading p,.excel-capabilities-note,.requirements-note) { color:var(--cvs-muted)!important; }
  & main :is(.catalog-facts,.catalog-fact,.catalog-check-list li,.catalog-article-meta,.excel-capability,.catalog-source-panel,.info-sidebar,.install-toc) {
   border-color:var(--cvs-line)!important;
   box-shadow:none!important;
  }

  /* Release lists retain their columns. The one faint rule shares the full
     rectangle of the hover surface, with no doubled white edge. */
  & main :is(.release-list,.release-head,.release-row,.ov-controls,.ov-version,.ov-version-side,.ov-year-block,.ov-intro-product,.ov-subscription-panel,.catalog-card,.catalog-card-icon,.platform-office-card) {
   background:transparent!important;
   border-color:transparent!important;
   box-shadow:none!important;
  }
  & main .release-row:not(:last-of-type) { box-shadow:inset 0 -1px 0 var(--cvs-line)!important; }
  & main :is(.release-row,.ov-version,.catalog-card,.platform-office-card):is(:hover,:focus-within) {
   background:color-mix(in srgb,var(--cvs-accent) 4%,var(--cvs-surface))!important;
  }
  & main .release-row { border-radius:0!important; }
  & main.product-page > #versions { --cvs-release-inset:20px; overflow-x:clip; }
  & main.product-page > #versions .release-list {
   width:calc(100% + var(--cvs-release-inset) * 2)!important;
   max-width:none!important;
   margin-inline:calc(-1 * var(--cvs-release-inset))!important;
  }
  & main.product-page > #versions .catalog-aside > :is(h2,p) { margin-inline-start:0!important; }
  & main.product-page > #versions .catalog-aside .product-choice-switch { margin-inline-end:0!important; }
  & main .catalog-card { border-top-color:var(--cvs-line)!important; }
  & main :is(.catalog-card,.platform-office-card):focus-visible { outline:2px solid var(--cvs-accent)!important; outline-offset:-2px!important; }
  & main .ov-version-list { gap:0!important; }
  & main .ov-version {
   --cvs-row-pad:25px;
   --cvs-row-before:0px;
   --cvs-row-after:7.5px;
   padding-block:calc(var(--cvs-row-pad) + var(--cvs-row-before)) calc(var(--cvs-row-pad) + var(--cvs-row-after))!important;
   border-radius:0!important;
  }
  & main .ov-version + .ov-version { --cvs-row-before:7.5px; }
  & main .ov-version:last-child { --cvs-row-after:0px; }
  & main .ov-version:not(:last-child) { box-shadow:inset 0 -1px 0 var(--cvs-line)!important; }
  & main :is(.ov-eyebrow,.ov-intro-links a,.ov-version h3 a:hover,.ov-action-note a,.catalog-card:hover h3,.catalog-text-link,.catalog-check-list li::before) { color:var(--cvs-accent-ink)!important; }
  & main .release-list .platform-tag {
   background:transparent!important;
   border-color:transparent!important;
   color:var(--cvs-muted)!important;
   box-shadow:none!important;
  }
  & main :is(.release-row .download,.ov-version-action,.platform-office-button,.catalog-primary-link,.download-return-button) {
   color:var(--cvs-accent-ink)!important;
   border-color:color-mix(in srgb,var(--cvs-accent) 25%,white)!important;
   background:var(--cvs-paper)!important;
   border-radius:4px!important;
   box-shadow:none!important;
   text-shadow:none!important;
  }
  & main :is(.release-row .download,.ov-version-action,.platform-office-button,.catalog-primary-link,.download-return-button):is(:hover,:focus-visible) {
   color:var(--cvs-accent-ink)!important;
   background:color-mix(in srgb,var(--cvs-accent) 7%,var(--cvs-paper))!important;
   border-color:color-mix(in srgb,var(--cvs-accent) 42%,white)!important;
   filter:none!important;
  }
  & main :is(.release-row .download,.ov-version-action,.platform-office-button,.catalog-primary-link,.download-return-button):focus-visible { outline:2px solid var(--cvs-accent)!important; outline-offset:3px!important; }

  /* Filters retain their visible selection and input boundaries. */
  & main :is(.product-choice-switch,.ov-platform-filter) { background:#f2f3f6!important; border-color:var(--cvs-line)!important; box-shadow:none!important; }
  & main :is(.filter-button,.requirements-platform-tab,.ov-filter) { color:var(--cvs-muted)!important; background:transparent!important; border-color:transparent!important; box-shadow:none!important; }
  & main :is(.filter-button,.requirements-platform-tab,.ov-filter):is(:hover,.active,[aria-pressed="true"],[aria-selected="true"]) {
   color:var(--cvs-accent-ink)!important;
   background:color-mix(in srgb,var(--cvs-accent) 6%,white)!important;
   border-color:color-mix(in srgb,var(--cvs-accent) 18%,white)!important;
   box-shadow:none!important;
  }
  & main :is(.filter-button,.requirements-platform-tab,.ov-filter):focus-visible { outline:2px solid var(--cvs-accent)!important; outline-offset:2px!important; }
  & main :is(.requirements-matrix,.requirements-matrix-head,.requirements-matrix-row) { background:transparent!important; border-color:var(--cvs-line)!important; box-shadow:none!important; }
  & main .ov-comparison-table :is(th,td,tr) { border-color:var(--cvs-line)!important; box-shadow:none!important; }

  /* FAQ stays an accordion with its existing topics and breakpoint behavior. */
  & main :is(.faq-section,.hub-faq,.ov-faq,section:has(.catalog-faq-list)) {
   --faq-ink:var(--cvs-ink);
   --faq-muted:var(--cvs-muted);
   --faq-accent:var(--cvs-accent);
   background:#faf9fc!important;
   border-color:transparent!important;
   box-shadow:inset 0 1px 0 var(--cvs-section-line)!important;
  }
  & main :is(.faq-topic-panel,.hub-faq-list,.ov-faq-list,.catalog-faq-list,.faq-item,.ov-faq-list details,.catalog-faq-list details) { background:transparent!important; border-color:transparent!important; box-shadow:none!important; }
  & main :is(.faq-topic-panel,.hub-faq-list,.ov-faq-list,.catalog-faq-list) > details + details { box-shadow:inset 0 1px 0 var(--cvs-faq-line)!important; }
  & main :is(.faq-topic-toolbar,.faq-topic-nav)::before { background:none!important; box-shadow:none!important; }
  & main :is(.faq-topic-toolbar,.faq-topic-nav) [role="tab"] { color:var(--cvs-muted)!important; background:transparent!important; border-color:transparent!important; box-shadow:none!important; }
  & main :is(.faq-topic-toolbar,.faq-topic-nav) [role="tab"]:is(:hover,[aria-selected="true"]) { color:var(--cvs-ink)!important; background:color-mix(in srgb,var(--cvs-accent) 6%,#faf9fc)!important; }

  & main > .download-return { background:color-mix(in srgb,var(--cvs-accent) 5%,var(--cvs-paper))!important; box-shadow:inset 0 1px 0 var(--cvs-section-line)!important; }
  & main > .download-return::before { background:none!important; }
  & main .download-return :is(h2,.download-return-copy) { color:var(--cvs-ink)!important; }
  & main .download-return :is(.download-return-platforms,.download-return-platforms li) { color:var(--cvs-muted)!important; }
  & main .download-return-platforms img { filter:none!important; }
  & main :is(.catalog-article,.catalog-source-panel,.info-download-card) { background:transparent!important; box-shadow:none!important; }
  & main .catalog-article { border-color:transparent!important; }
  & main .catalog-comparison-table { color:var(--cvs-ink)!important; }
  & main .catalog-comparison-table th { color:var(--cvs-ink)!important; background:color-mix(in srgb,var(--cvs-accent) 5%,var(--cvs-paper))!important; }
  & main .info-download-card { border-color:var(--cvs-line)!important; }
  & main .info-download-card:hover { background:color-mix(in srgb,var(--cvs-accent) 4%,var(--cvs-paper))!important; }

  /* DLE search uses its own container, rather than a main element. */
  & > .dle-system-content {
   --cvs-accent:var(--catalog-office-brand,#5b5fc7);
   color:var(--cvs-ink)!important;
   background:var(--cvs-paper)!important;
  }
  & .dle-system-content :is(.box,.box_in,.searchtable) { background:transparent!important; border-color:transparent!important; box-shadow:none!important; }
  & .dle-system-content .searchpage { padding-inline:0!important; border-width:0!important; }
  & .dle-system-content .searchpage .box_in,
  & .dle-system-content .searchtable td.search { padding-inline:0!important; }
  & .dle-system-content .searchtable td.search > div { margin-inline:0!important; }
  & .dle-system-content :is(input[type="text"],input[type="search"],select,textarea) { min-height:40px; padding:8px 12px; color:var(--cvs-ink)!important; background:white!important; border:1px solid #d9d9e1!important; border-radius:4px!important; }
  & .dle-system-content #searchinput { width:100%; max-width:540px; }
  & .dle-system-content :is(input.bbcodes,button.bbcodes) { min-height:40px; margin-block:3px; padding:8px 12px; color:var(--cvs-accent)!important; background:color-mix(in srgb,var(--cvs-accent) 4%,white)!important; border:1px solid color-mix(in srgb,var(--cvs-accent) 25%,white)!important; border-radius:4px!important; }
  & .dle-system-content :is(input.bbcodes,button.bbcodes):hover { background:color-mix(in srgb,var(--cvs-accent) 8%,white)!important; }
  & .dle-system-content :is(input,select,textarea,button):focus-visible { outline:2px solid var(--cvs-accent)!important; outline-offset:2px!important; }
 }

 /* The FAQ sits inside the article column on this page; keep its surface seamless. */
 html:has(link[rel="canonical"][href$="/file-checks/"]) body.office-catalog-dle main#top.catalog-editorial-page .info-content section#faq.faq-section {
  background:transparent!important;
 }

 @media(max-width:760px) {
  body.office-catalog-dle:not(:has(.catalog-home-page)) {
   --cvs-gutter:12px;
   --cvs-inner-inset:0px;
  }
  body.office-catalog-dle:not(:has(.catalog-home-page)) main > .hero .hero-copy :is(.hero-heading-content,.hero-heading-support) { padding-left:0!important; }
 }
 @media(max-width:620px) {
  body.office-catalog-dle:not(:has(.catalog-home-page)) main.product-page > #versions { --cvs-release-inset:0px; }
 }
 @media(max-width:650px) {
  body.office-catalog-dle:not(:has(.catalog-home-page)) main .ov-version { --cvs-row-pad:18px; }
 }
}
