/* wl-desktop.css — WiseLeaf DESKTOP-VISIBLE fixes, owner-approved 2026-08-03.
   Loaded ONLY on the pages listed below (via their own <link>), never site-wide.
   Unlike wl-mobile.css (phones only), every rule here is deliberately visible
   on desktop; each rule cites its owner approval. Keep this file tiny.

   Pages: human-subjects-research, animal-research, conflict-of-interest,
          recent-publications, popular-articles, about, search-results. */

/* search-results: Search and Advanced Search sat on different lines on
   desktop (owner 2026-08-04). One row, equal height. Mobile stacking is
   handled by wl-mobile.css; this block is desktop-only. */
@media (min-width: 769px) {
  .col-md-8:has(#searchButton) {
    display: flex !important; align-items: stretch; gap: 12px; }
  body:has(.advanced-search-panel) #searchButton,
  body:has(.advanced-search-panel) #advancedSearchBtn {
    display: inline-flex !important; align-items: center; margin: 0 !important; }
}

/* About hero: the site's text-shadow makes the banner text fuzzy on every
   width (owner 2026-08-04: "fix it ... on both desktop and mobile view").
   Deliberately unscoped by width; the mobile layer carries a copy too. */
html body .hero.about-hero .hero-title,
html body .hero.about-hero .hero-subtitle,
html body .hero.about-hero .hero-description,
html body section.hero.about-hero .hero-title,
html body section.hero.about-hero .hero-subtitle,
html body section.hero.about-hero .hero-description { text-shadow: none !important; }

/* About footer: legacy rule turns the "Our Journals" resource link into a
   stray button; plain link like its siblings (owner 2026-08-04, both widths) */
html body .wiseleaf-footer a[href$="journals.html"] {
  background: transparent !important; padding: 0 !important;
  border-radius: 0 !important; box-shadow: none !important;
  border: none !important; display: inline-flex !important;
  margin: 0 !important; transform: none !important; }

/* Ethics trio: hero title was slate-on-teal (unreadable) on every width.
   Owner 2026-08-03: "for desktop it is still same" — make it white there too.
   (The mobile copy of this rule lives in wl-mobile.css.) */
@media (min-width: 769px) {
  .ethics-hero h1 { color: #fff !important; }

  /* Publications listings: owner wants the PPTX artwork behind the header on
     desktop as well — text-free crop (wl-banner-clean.jpg) under a white wash. */
  body:has(.publication-card) .page-header,
  body:has(.article-card) .page-header {
    background: linear-gradient(rgba(255,255,255,.72), rgba(255,255,255,.72)),
      url('../images/heroes/wl-banner-clean.jpg') center bottom / cover no-repeat !important;
    border-radius: 14px;
    padding: 40px 24px !important;
  }
}