/* VizzEx blog post styles — "AI Citation Study Findings" series
   ---------------------------------------------------------------
   Namespace: every class/variable is "vzcs-" prefixed (unique — the site design
   system in vizzex-divi.css owns "vz-", incl. .vz-btn/.vz-callout/.vz-num), so
   these rules cannot collide with the site or other posts.

   Scope: rules are anchored to ".et_pb_post_content" (Divi's Post Content wrapper,
   which contains ALL of the post body). We do NOT anchor to a manual
   ".vzcs-post" <div> wrapper because WordPress' wpautop closes that <div> early,
   leaving the callouts/tables/etc. as siblings outside it. Anchoring to
   .et_pb_post_content also gives 0,2,0 specificity so these win over the theme's
   default blockquote/table styles without needing !important.

   Deploy: wp-content/mu-plugins/vizzex-post-styles.css
   Loads:  only on posts whose content contains the string "vzcs-post"
           (the <div class="vzcs-post"> wrapper is kept purely as that enqueue
           trigger — see vizzex-customizations.php Part A2). */

:root {
  --vzcs-accent:       #1a365d;
  --vzcs-accent-hover: #24497a;
  --vzcs-rule:         #e2e8f0;
  --vzcs-rule-strong:  #cbd5e1;
  --vzcs-tint:         #f7f9fc;
  --vzcs-head-tint:    #f1f5f9;
}

/* Kicker line under the title and the closing author note */
.et_pb_post_content .vzcs-kicker { font-size: 1.05em; margin-bottom: 24px; }
.et_pb_post_content .vzcs-bio { font-size: 0.95em; margin-top: 40px; padding-top: 16px; border-top: 1px solid var(--vzcs-rule); }

/* Data tables */
.et_pb_post_content .vzcs-table { width: 100%; border-collapse: collapse; margin: 16px 0 24px; font-size: 0.95em; }
.et_pb_post_content .vzcs-table-tight { margin-bottom: 8px; }
.et_pb_post_content .vzcs-table caption { caption-side: top; text-align: left; font-weight: 700; padding-bottom: 8px; }
.et_pb_post_content .vzcs-table th,
.et_pb_post_content .vzcs-table td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--vzcs-rule); vertical-align: top; }
.et_pb_post_content .vzcs-table thead th { border-bottom: 2px solid var(--vzcs-rule-strong); background: var(--vzcs-head-tint) !important; } /* !important: beats Divi's stubborn default th background */
.et_pb_post_content .vzcs-table tbody th[scope="row"] { background: var(--vzcs-tint); width: 30%; }
.et_pb_post_content .vzcs-table tbody th.vzcs-plain { background: transparent; font-weight: normal; width: auto; }
.et_pb_post_content .vzcs-table td.vzcs-num { width: 15%; white-space: nowrap; }
.et_pb_post_content .vzcs-note { font-size: 0.9em; margin-top: 0; }

/* The "four words" definition box (content, not a call-out) */
.et_pb_post_content .vzcs-defbox { border: 1px solid var(--vzcs-rule); border-radius: 6px; padding: 20px 24px; margin: 24px 0; background: var(--vzcs-tint); }
.et_pb_post_content .vzcs-defbox h3 { margin-top: 0; }
.et_pb_post_content .vzcs-defbox p:last-child { margin-bottom: 0; }
.et_pb_post_content .vzcs-defs { margin: 0; }
.et_pb_post_content .vzcs-defs dt { font-weight: 700; margin-top: 8px; }
.et_pb_post_content .vzcs-defs dd { margin: 2px 0 10px 0; }

/* Verdict pull quote (a <blockquote> — the .et_pb_post_content anchor beats the theme's blockquote style) */
.et_pb_post_content .vzcs-verdict { border-left: 4px solid var(--vzcs-accent); margin: 16px 0 24px; padding: 8px 20px; font-size: 1.25em; }
.et_pb_post_content .vzcs-verdict p { margin: 0; }

/* Call-out boxes (video, program, apps). These are <aside>, not part of the post's heading outline */
.et_pb_post_content .vzcs-callout { border: 1px solid var(--vzcs-rule-strong); border-left: 6px solid var(--vzcs-accent); border-radius: 6px; padding: 20px 24px; margin: 32px 0; background: var(--vzcs-tint); }
.et_pb_post_content .vzcs-callout-title { font-size: 1.3em; font-weight: 700; line-height: 1.3; margin: 0 0 12px; }
.et_pb_post_content .vzcs-callout p:last-child { margin-bottom: 0; }
.et_pb_post_content .vzcs-cta { margin: 16px 0 8px; }
.et_pb_post_content .vzcs-btn,
.et_pb_post_content .vzcs-btn:visited { display: inline-block; padding: 10px 18px; background: var(--vzcs-accent); color: #ffffff; text-decoration: none; border-radius: 4px; font-weight: 600; }
.et_pb_post_content .vzcs-btn:hover,
.et_pb_post_content .vzcs-btn:focus { background: var(--vzcs-accent-hover); color: #ffffff; text-decoration: none; }

/* Small screens: let wide tables scroll sideways instead of breaking the layout */
@media (max-width: 640px) {
  .et_pb_post_content .vzcs-table { display: block; overflow-x: auto; }
  .et_pb_post_content .vzcs-table tbody th[scope="row"] { width: auto; }
  .et_pb_post_content .vzcs-callout, .et_pb_post_content .vzcs-defbox { padding: 16px 18px; }
}