/*
 * Rules moved from Appearance -> Customize -> Additional CSS (live content, 16 Oct 2026).
 * Served as-is, outside the webpack build, and enqueued after every other stylesheet so it
 * keeps winning. Keep selectors, values, !important flags and order unchanged; tell PI before
 * renaming any class or id targeted here.
 */

/* ============================================================
   Psychopharmacology Institute - WordPress Additional CSS
   (Appearance -> Customize -> Additional CSS)
   Reorganized 2026-08-27.
   House values: small text 13.5px/1.55 · gray #757378 · link #5a52b8 · lilac #e4e1f0
   ============================================================ */

.home :where(.wp-block-group.has-background) { padding: 1.25em 2.375em; }

/* --- References (all publication types) --- */
.pi-references,
.pi-references * { font-size: 13.5px !important; color: #757378 !important; }
.pi-references { line-height: 1.55 !important; }
.pi-references a { color: #5a52b8 !important; }
.pi-cite { text-decoration: none; font-weight: 600; }
[id^="ref-"] { scroll-margin-top: 100px; }

/* --- Reference notes: <details class="pi-reference-note"> as a SIBLING
       after its <p class="pi-references">, never nested inside it --- */
.pi-reference-note {
  margin: 4px 0 20px 20px;
  padding-left: 14px;
  border-left: 3px solid #e4e1f0;
  font-size: 13.5px !important;
  line-height: 1.55 !important;
  color: #757378 !important;
}
.pi-reference-note summary { cursor: pointer; font-weight: 600; color: #5a52b8 !important; }
.pi-reference-note p { margin: 6px 0 0; font-size: inherit !important; color: inherit !important; }

/* --- Transcript slide references (was #767676; unified to house gray) --- */
.pi-slide-references,
.pi-slide-references * { font-size: 10px !important; color: #757378 !important; }

/* --- Quick Takes: FRAGILE, keys off the Gutenberg heading ids --- */
#abstract ~ p, #abstract ~ ul, #abstract ~ ol,
#h-abstract ~ p, #h-abstract ~ ul, #h-abstract ~ ol {
  font-size: 13.5px !important;
  line-height: 1.55 !important;
}
#reference ~ p, #reference ~ ul, #reference ~ ol,
#h-reference ~ p, #h-reference ~ ul, #h-reference ~ ol { color: #757378 !important; }

/* --- Tables inside a publication (ADR-0034) ---------------- */

/* Only a DATA table: the infographics are built as <table> for layout, and these
   rules were painting the first-column tint over their gradient. Across the 25
   Spanish guides, 39 tables carry <th> and the 24 layout ones carry none. */
.post-content table:has(th) {
  width: 100%;
  border-collapse: collapse;
  table-layout: auto;           /* columns sized by their contents */
  font-size: 14px;
  line-height: 1.4;
  color: #191926;
  margin: 1.25em 0;
}
.post-content table:has(th) th {
  /* Wrap between words, never inside one: fixed widths split the headers as
     "Norepinefr ina" and "Dop ami na". A column name is a term. */
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
  background: #027FBD;
  color: #FFFFFF;
  font-weight: 600;
  text-align: left;
  padding: 8px 10px;
  border: 1px solid #027FBD;
}
.post-content table:has(th) td {
  padding: 7px 10px;
  border: 1px solid #DDDDDD;
  vertical-align: top;
  /* The same rule as the header above, and for the same reason: a one-word cell
     is a term. In the Spanish table of EC090 (22/09/2026) "Inatencion" came out
     as "Inatencio / n" and "Hiperactividad" as "Hiperacti / vidad", cut mid-word
     with no hyphen, because the column was 83px and the word needs 95. The
     !important is needed because WordPress sets word-break on the block's
     <figure> and it inherits down to the cell. */
  overflow-wrap: normal;
  word-break: normal !important;
}
.post-content table:has(th) tbody tr:nth-child(even) { background: #F0F8FE; }
.post-content table:has(th) tbody td:first-child { background: #F8F9FA; font-weight: 600; }

/* On a narrow screen the table is set a size smaller rather than overflowing. */
@media (max-width: 780px) {
  .post-content table:has(th) { font-size: 13px; }
  .post-content table:has(th) th,
  .post-content table:has(th) td { padding: 6px 7px; }
}

/* --- Infographics ------------------------------------------
   They are laid out with <table> and set their own sizes inline, but the theme
   styles lists deep enough to win: a card's <ul> went back to the site's 16px
   inside a 14px card. !important because the theme's selector is more specific
   than any sane one here. */
.post-content table:not(:has(th)) ul,
.post-content table:not(:has(th)) ol,
.post-content table:not(:has(th)) li,
.post-content table:not(:has(th)) p {
  font-size: inherit !important;
  line-height: 1.5 !important;
}

/* --- CME accreditation block: section headings (2026-09-02) ---
   El bloque lo construye el pipeline con cinco secciones <h3>. El tema les da
   18px en negrita y margen superior cero, así que se pegan unas con otras.
   El gancho ya está en el contenido; esto es la pintura. */
.cme-information-content h3 {
  margin: 1.8em 0 .6em;
  padding-top: 1em;
  border-top: 1px solid #e4e1f0;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #5a52b8 !important;
}
.cme-information-content h3:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

/* --- Video Lecture sections: faculty name (2026-09-30) ---
   The theme's single-video-lecture-lesson.css gives every <h2> inside
   .lesson-content "margin: 16px 0", and the faculty name is an <h2>, so it sat
   18px above its job title. Quick Takes have no such rule (gap 2px). This
   removes the margin on the name only, so both types look the same. */
.learndash-wrapper.video-lecture-lesson .lesson-content .author-details .author-name {
  margin: 0;
}
/* --- Instant-access pop-up: newer faculty photos (2026-10-16) ---
   The theme draws a fixed image of seven faculty photos. This shows our own image instead
   (media 1896666: Phelps, Osser, Beach, Hudak, Koire, Freudenreich, Aiken), on all nine sites. */
.instant-access-modal .image-container {
  background: url("https://cdn.psychopharmacologyinstitute.com/wp-content/uploads/2026/10/instant-access-modal-faculty-2026-10.webp") center / contain no-repeat;
}
.instant-access-modal .image-container img { visibility: hidden; }