/**
 * Interconnect local reskin layer
 *
 * Edit the CSS custom properties below to retheme the mirrored site.
 * This file loads after all other stylesheets and uses !important where
 * needed to override inline critical CSS baked into each HTML page.
 */

:root {
  /* Primary palette */
  --skin-color-primary-dark: #095f67;
  --skin-color-primary: #128374;
  --skin-color-primary-light: #45bfb4;
  --skin-color-primary-accent: #1aa292;

  /* Secondary / accent palette */
  --skin-color-secondary: #efa938;
  --skin-color-secondary-light: #f1aa38;

  /* Neutrals */
  --skin-color-text: #838383;
  --skin-color-text-muted: #707070;
  --skin-color-text-nav: #4f4f4f;
  --skin-color-surface: #ffffff;
  --skin-color-surface-muted: #ecf8f7;
  --skin-color-header-bg: #e2e1e9;

  /* Typography */
  --skin-font-light: "Museo Sans W01_300", Arial, Helvetica, sans-serif;
  --skin-font-medium: "Museo Sans W01_500", Arial, Helvetica, sans-serif;
  --skin-font-bold: "Museo Sans W01_700", Arial, Helvetica, sans-serif;
  --skin-font-black: "Museo Sans W01_900", Arial, Helvetica, sans-serif;

  /* Logos — swap paths to use custom SVG/PNG assets */
  --skin-logo-interconnect: url("/assets/img/logo-interconnect.c23d5c0c.svg");
  --skin-logo-intercept: url("/assets/img/logo-intercept.f589df39.svg");

  /* Landing page header triangle (Figma tertiary01_midnight) */
  --skin-color-splitter-triangle: #332c47;
}

/* ------------------------------------------------------------------ */
/* Base typography                                                    */
/* ------------------------------------------------------------------ */

body {
  color: var(--skin-color-text) !important;
  background-color: var(--skin-color-surface) !important;
}

h1 {
  color: var(--skin-color-primary-dark) !important;
}

h2 {
  color: var(--skin-color-secondary-light) !important;
}

h3,
.sect-hcp h2 {
  color: var(--skin-color-primary-light) !important;
}

strong {
  font-family: var(--skin-font-bold) !important;
}

a.button {
  background-color: var(--skin-color-secondary) !important;
  color: #fff !important;
}

/* ------------------------------------------------------------------ */
/* Header & navigation                                                */
/* ------------------------------------------------------------------ */

header .header-wrapper .logo:before {
  background-color: var(--skin-color-primary-light) !important;
}

/* Landing page only — recolor header triangle, keep grey bar + logo unchanged */
.splitter header .header-wrapper .logo:before {
  background-color: var(--skin-color-splitter-triangle) !important;
}

header .header-wrapper .logo a {
  background-image: var(--skin-logo-interconnect) !important;
}

header .header-wrapper .nav nav {
  background-color: var(--skin-color-primary-dark) !important;
}

header .header-wrapper .nav nav .hcp a,
header .header-wrapper .nav nav .pat a {
  color: var(--skin-color-primary-dark) !important;
}

header .header-wrapper .nav nav .hcp a:after,
header .header-wrapper .nav nav .pat a:after {
  border-left-color: var(--skin-color-primary-dark) !important;
}

header .header-wrapper .nav .nav-econsent a {
  color: var(--skin-color-primary-dark) !important;
}

.sect-pat header {
  background-color: var(--skin-color-secondary) !important;
}

.sect-hcp header {
  background-color: var(--skin-color-primary) !important;
}

@media only screen and (min-width: 980px) {
  header {
    background-color: var(--skin-color-header-bg) !important;
  }

  header .header-wrapper:before,
  header .header-wrapper:after {
    background-color: var(--skin-color-primary-accent) !important;
  }

  header .header-wrapper .utility .utility-wrapper a {
    color: var(--skin-color-text-muted) !important;
  }

  header .header-wrapper .nav {
    background-color: var(--skin-color-primary) !important;
  }

  header .header-wrapper .nav nav ul li ul.sub-menu {
    background-color: var(--skin-color-primary-light) !important;
  }

  header .header-wrapper .nav nav ul li ul.sub-menu li a {
    color: var(--skin-color-text-nav) !important;
  }

  header .header-wrapper .nav nav ul li.selected:not(.econsent):not(.enrollment):before {
    border-top-color: var(--skin-color-secondary) !important;
  }

  header .header-wrapper .nav nav ul li.econsent {
    background-color: var(--skin-color-secondary) !important;
  }

  header .header-wrapper .nav nav ul li.econsent a {
    color: var(--skin-color-primary) !important;
  }

  header .header-wrapper .nav nav ul li.enrollment {
    background-color: var(--skin-color-primary-dark) !important;
  }

  .sect-pat header .header-wrapper .logo:before {
    background-color: var(--skin-color-secondary) !important;
  }

  .sect-hcp header .header-wrapper .logo:before {
    background-color: var(--skin-color-primary-dark) !important;
  }
}

/* ------------------------------------------------------------------ */
/* Content sections                                                   */
/* ------------------------------------------------------------------ */

.sect-pat main section .section-wrapper a:not(.button) {
  color: var(--skin-color-secondary-light) !important;
}

.sect-hcp main section .section-wrapper a:not(.button) {
  color: var(--skin-color-primary-light) !important;
}

main section.module-2,
main section.module-4 {
  background-color: var(--skin-color-surface-muted) !important;
}

main section.module-2 .section-wrapper h2,
main section.module-3 .section-wrapper h2,
main section.module-4 .section-wrapper h2 {
  color: var(--skin-color-primary-light) !important;
}

main section.module-3 ul li:nth-child(2n + 2) {
  background-color: var(--skin-color-surface-muted) !important;
}

main section.module-3 ul li .inner h3,
main section.module-1 ul li .inner h3 {
  background-color: var(--skin-color-secondary) !important;
}

.sect-hcp main section.module-1 ul li .inner h3,
main section.module-2 .section-wrapper .accordion h3 {
  background-color: var(--skin-color-primary-light) !important;
}

main section.module-2 .section-wrapper .accordion ol li:before {
  background-color: var(--skin-color-secondary) !important;
}

main section.module-2 .section-wrapper .accordion ol li:after {
  border-top-color: var(--skin-color-secondary) !important;
}

main section.module-2 .section-wrapper .accordion ol li h4 {
  color: var(--skin-color-primary-dark) !important;
}

/* Splitter homepage CTAs — handled in skin-splitter.css on landing page */

/* ------------------------------------------------------------------ */
/* Footer                                                             */
/* ------------------------------------------------------------------ */

footer .footer-wrapper .footer-top .logo a {
  background-image: var(--skin-logo-intercept) !important;
}

/* Widen the copyright block (Figma: 1020px) so the trademark line fits on
   one line instead of orphaning "Alfasigma S.p.A." onto its own line */
@media only screen and (min-width: 980px) {
  footer .footer-wrapper .footer-bottom {
    max-width: 1050px !important;
  }
}

/* ------------------------------------------------------------------ */
/* Modals / interstitials                                             */
/* ------------------------------------------------------------------ */

.interstitial .inner p.header {
  color: var(--skin-color-primary-light) !important;
}

.interstitial .inner .close a {
  border-color: var(--skin-color-primary-light) !important;
}

.interstitial .inner .close a:before,
.interstitial .inner .close a:after {
  background-color: var(--skin-color-primary-light) !important;
}

#interstitial_hcp.interstitial .inner .action a.button.yes {
  background-color: var(--skin-color-primary-light) !important;
}

/* Disable OCALIVA takedown modal during local reskin */
#interstitial_takedown {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}