/* DDQX Study Mode v0.1.1 — independent, opt-in presentation layer.
 * Reconciled against Appearance 0.3.10, Template Layout 0.2.1,
 * Discovery Navigation 0.2.1, Connected Backgrounds 0.9.2.
 * ALL page transformations must be prefixed by [data-ddqx-study="on"].
 * Header toggle styling is the single deliberate Standard-mode addition.
 * Do not copy these styles into Appearance, Template Layout or the theme.
 */

/* Shared utility controls: no form or product styling is inherited into them. */
.ddqx-study-control[hidden], .ddqx-study-fallback[hidden] { display:none !important; }
html.ddqx-appearance .ddqx-site-header .ddqx-appearance-bar {
  display:flex; align-items:center; justify-content:flex-end; flex-wrap:nowrap; gap:8px;
}
.ddqx-study-control { flex:0 0 auto; box-sizing:border-box; }
.ddqx-study-toggle {
  box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center;
  gap:5px; min-height:44px; min-width:80px; max-width:100%;
  padding:7px 9px 8px; white-space:nowrap;
  font:600 12px/1.3 Montserrat,Arial,sans-serif;
  background:#104A56; color:#fff; border:1px solid #458795;
  border-bottom:5px solid #E3C565; border-radius:7px;
  box-shadow:none; cursor:pointer; transition:none;
}
html.ddqx-appearance .ddqx-site-header button.ddqx-study-toggle {
  color:#fff !important; background-color:#104A56 !important;
}
.ddqx-study-toggle[aria-pressed="true"],
html.ddqx-appearance .ddqx-site-header button.ddqx-study-toggle[aria-pressed="true"] {
  background-color:#16697A !important; color:#fff !important;
  box-shadow:inset 0 0 0 2px #E3C565;
}
.ddqx-study-toggle__state { padding-left:5px; border-left:1px solid currentColor; }
.ddqx-study-toggle:focus-visible,
html.ddqx-appearance .ddqx-site-header button.ddqx-study-toggle:focus-visible {
  outline:3px solid #E3C565 !important; outline-offset:3px !important;
}
.ddqx-study-control--mobile { display:none; }
@media (min-width:621px) and (max-width:1379px) {
  .ddqx-study-control--header .ddqx-study-toggle__modeword { display:none; }
}
/* The supplied header has a 621px three-column breakpoint; the added
 * labelled control needs ~20px of extra space there. Compact ONLY the brand
 * asset, not the navigation, CTA, or input. This is a control-fit exception. */
@media (min-width:621px) and (max-width:700px) {
  html.ddqx-appearance .ddqx-site-header .ddqx-header-brand {
    width:clamp(200px,32vw,224px) !important;
    flex-basis:clamp(200px,32vw,224px) !important;
    min-width:0;
  }
  html.ddqx-appearance .ddqx-site-header .ddqx-header-brand .custom-logo-link {
    width:100% !important;
  }
}
@media (max-width:620px) {
  /* Appearance's current 94px grid cell is NOT expanded or overlapped. */
  html.ddqx-appearance .ddqx-site-header .ddqx-study-control--header { display:none !important; }
  .ddqx-ia-mobile-panel .ddqx-study-control--mobile { display:block; margin:10px 0 12px; }
  .ddqx-ia-mobile-panel .ddqx-study-control--mobile .ddqx-study-toggle {
    width:100%; justify-content:space-between; min-height:44px; font-size:13px;
  }
  .ddqx-ia-mobile-panel .ddqx-study-toggle:focus-visible {
    outline:3px solid #104A56 !important;
  }
  /* The existing mobile menu is an absolute overlay. Only while its Study
   * control is present and the menu is open, give the header a stacking
   * context above the content so this control remains pointer-accessible. */
  html.ddqx-appearance .ddqx-site-header:has(.ddqx-ia-mobile[open] .ddqx-study-control--mobile) {
    position:relative; z-index:1001; overflow:visible;
  }
}
.ddqx-study-fallback {
  position:fixed; right:max(16px,env(safe-area-inset-right));
  bottom:max(16px,env(safe-area-inset-bottom)); z-index:10010;
}
.ddqx-study-fallback .ddqx-study-control--fallback { display:block; }
@media (forced-colors:active) {
  .ddqx-study-toggle,
  html.ddqx-appearance .ddqx-site-header button.ddqx-study-toggle,
  html.ddqx-appearance .ddqx-site-header button.ddqx-study-toggle[aria-pressed="true"] {
    background:ButtonFace !important; color:ButtonText !important;
    border:2px solid ButtonText !important; forced-color-adjust:auto;
  }
  .ddqx-study-toggle[aria-pressed="true"] { outline:2px solid Highlight; outline-offset:-4px; }
  .ddqx-study-toggle:focus-visible { outline:3px solid Highlight !important; }
}
@media print { .ddqx-study-control, .ddqx-study-fallback { display:none !important; } }

/* ===== Root-mode scope: nothing below changes Standard Mode. ===== */
html.ddqx-appearance[data-ddqx-study="on"] body {
  --ddqx-study-gutter:clamp(16px,1.75vw,28px);
  --ddqx-study-canvas-width:1540px;
  --ddqx-study-prose-width:104ch;
  --wp--style--global--wide-size:1540px;
  --wp--style--global--content-size:104ch;
  background-image:none !important;
  /* Appearance 0.3.10 paints white canvas ink over its dark teal wallpaper.
   * Study replaces that wallpaper with an opaque semantic reading surface,
   * so canvas roles must follow the correct panel-ink roles in both themes.
   * Local dark hero/alert/card boundaries continue to own their own colors. */
  --da-canvas-text:var(--da-panel-text);
  --da-canvas-muted:var(--da-panel-muted);
  --da-canvas-link:var(--da-panel-link);
  --da-canvas-focus:var(--da-panel-focus);
  background-color:var(--da-surface) !important;
}
html.ddqx-appearance[data-ddqx-study="on"] .wp-site-blocks {
  background-image:none !important; background-color:var(--da-surface) !important;
  background-attachment:scroll !important; background-size:auto !important;
}

/* The Appearance owner forces page titles white on its usual teal canvas.
 * Study uses the semantic ink role after resetting the canvas text contract. */
html.ddqx-appearance[data-ddqx-study="on"] main .wp-block-post-title,
html.ddqx-appearance[data-ddqx-study="on"] main > .ddqx-article-meta {
  color:var(--da-text) !important;
}

/* Exact decorative owner: no generic SVG/img/canvas/video hiding. */
html.ddqx-appearance[data-ddqx-study="on"] body.ddqx-ccb-enabled {
  --ddqx-ccb-wallpaper:none !important; --ddqx-ccb-field:none !important;
  background-image:none !important; background-color:var(--da-surface) !important;
  background-attachment:scroll !important;
}
html.ddqx-appearance[data-ddqx-study="on"] body.ddqx-ccb-enabled.ddqx-ccb-shell-outer > :is(#page,.site,.wp-site-blocks,#wrapper,#site-wrapper),
html.ddqx-appearance[data-ddqx-study="on"] body.ddqx-ccb-enabled.ddqx-ccb-shell-outer > #page > .site {
  background-image:none !important; background-color:var(--da-surface) !important;
  background-attachment:scroll !important;
}
html.ddqx-appearance[data-ddqx-study="on"] #ddqx-ccb-network {
  display:none !important; animation:none !important;
}

/* Known ornamental gradients only. Preserve the dark header/hero/footer
 * foreground–surface contrast boundaries, images, and section semantics. */
html.ddqx-appearance[data-ddqx-study="on"] .ddqx-site-header {
  background-image:none !important; background-color:#0B343C !important;
  box-shadow:none !important;
}
html.ddqx-appearance[data-ddqx-study="on"] main :is(
  .ddqx-home-v3,.ddqx-section,.ddqx-product-discovery,.ddqx-hero,.ddqx-ref-final
) {
  background-image:none !important;
}
html.ddqx-appearance[data-ddqx-study="on"] :is(
  .ddqx-site-footer,#ddqx-white-coat-journey
) { background-image:none !important; box-shadow:none !important; }

/* Wide workspace: main + its known DDQX Gutenberg/lesson ancestors.
 * Keep the 16px safe outer gutter; do not widen form controls individually. */
html.ddqx-appearance[data-ddqx-study="on"] body :is(main.ddqx-content-shell,main#wp--skip-link--target) {
  --wp--style--global--wide-size:1540px;
  --wp--style--global--content-size:104ch;
  box-sizing:border-box; width:100% !important; max-width:100% !important;
  padding-inline:max(var(--ddqx-study-gutter),env(safe-area-inset-left),env(safe-area-inset-right)) !important;
}
html.ddqx-appearance[data-ddqx-study="on"] main :is(
  .wp-block-post-content,.ddqx-post-content,.ddqx-mcat-content,
  .ddqx-reference-journey,.ddqx-core-reviewed,.ddqx-core-library,
  .ddqx-policy-reviewed,.ddqx-home-v3
) {
  --wp--style--global--wide-size:1540px;
  --wp--style--global--content-size:104ch;
  box-sizing:border-box; width:100% !important;
  max-width:var(--ddqx-study-canvas-width) !important;
  margin-inline:auto !important;
}
html.ddqx-appearance[data-ddqx-study="on"] main .wp-block-post-content > .ddqx-reference-journey {
  --ddqx-layout-gutter:0px; padding-inline:0 !important;
}
html.ddqx-appearance[data-ddqx-study="on"] body.ddqx-reading-page main :is(.wp-block-post-content,.ddqx-post-content) {
  --wp--style--global--content-size:104ch;
  --wp--style--global--wide-size:1540px;
  max-width:1540px !important; width:100% !important;
  padding:clamp(16px,2vw,28px) !important;
  border-radius:6px; box-shadow:none;
}
html.ddqx-appearance[data-ddqx-study="on"] body.ddqx-reading-page {
  --ddqx-reading-measure:104ch;
}

/* Only prose receives a bounded reading measure. Models, diagrams, tables,
 * maps, media, and functional grids retain their own width and behavior. */
html.ddqx-appearance[data-ddqx-study="on"] body.ddqx-reading-page :is(.ddqx-post-content,.ddqx-mcat-content) > :is(p,ul,ol,blockquote,details,h2,h3),
html.ddqx-appearance[data-ddqx-study="on"] .ddqx-reference-journey .ddqx-section > :is(p,ul,ol),
html.ddqx-appearance[data-ddqx-study="on"] .ddqx-core-reviewed .ddqx-ref-inner > :is(p,ul,ol),
html.ddqx-appearance[data-ddqx-study="on"] .ddqx-method-reviewed .ddqx-section > :is(p,ul,ol),
html.ddqx-appearance[data-ddqx-study="on"] .ddqx-policy-reviewed :is(.ddqx-policy-hero,.ddqx-policy-copy),
html.ddqx-appearance[data-ddqx-study="on"] .ddqx-core-library > :is(p,ul,ol) {
  max-width:min(100%,var(--ddqx-study-prose-width)) !important;
}
html.ddqx-appearance[data-ddqx-study="on"] main :is(.ddqx-post-content,.ddqx-mcat-content,.ddqx-reference-journey) :is(
  .wp-block-columns,.wp-block-column,.wp-block-table,figure,.ddqx-experience,
  .ddqx-mcat-practice,.ddqx-lab-panel,.ddqx-ahsh,.ddqx-mse-root
) { min-width:0; max-width:100%; }
html.ddqx-appearance[data-ddqx-study="on"] main :is(.wp-block-table,pre) {
  max-width:100%; overflow-x:auto; overscroll-behavior-x:contain;
}

/* Flatten only documented cosmetic DDQX shell families. Do not alter
 * clinical alert/feedback, chosen-option, form, or paid-flow boundaries. */
html.ddqx-appearance[data-ddqx-study="on"] main :is(
  .ddqx-home-v3,.ddqx-reference-journey,.ddqx-core-reviewed
) > :is(.ddqx-section,.ddqx-product-discovery):not(.ddqx-ref-final) {
  box-shadow:none !important; border-radius:4px;
  margin-block:clamp(24px,2.5vw,40px) !important;
}
html.ddqx-appearance[data-ddqx-study="on"] main :is(
  .ddqx-info-card,.ddqx-process-card,.ddqx-stage-card,
  .ddqx-feature-panel,.ddqx-method-card,.ddqx-ref-stage-card
) { box-shadow:none !important; }
html.ddqx-appearance[data-ddqx-study="on"] .ddqx-core-reviewed > .ddqx-ref-inner > .ddqx-section {
  box-shadow:none !important; margin-block:clamp(24px,2.5vw,40px) !important;
}
html.ddqx-appearance[data-ddqx-study="on"] .ddqx-reference-journey > .ddqx-section:not(.ddqx-ref-final),
html.ddqx-appearance[data-ddqx-study="on"] .ddqx-core-reviewed > .ddqx-ref-inner > .ddqx-section {
  padding:clamp(16px,2vw,28px) !important;
}
html.ddqx-appearance[data-ddqx-study="on"] main :is(
  .ddqx-home-v3,.ddqx-reference-journey,.ddqx-core-reviewed
) > :is(.ddqx-section,.ddqx-product-discovery):not(.ddqx-ref-final) {
  border-top:0 !important; /* Former ornamental top-edge gradient only. */
}

/* Functional learning families: width only, never input/answer/output styling. */
html.ddqx-appearance[data-ddqx-study="on"] main :is(
  .ddqx-wcd,.ddqx-experience,.ddqx-ahsh,.ddqx-mse-root,
  .ddqx-mcat-practice,.ddqx-cpr-foundation-page,.ddqx-mcat-content
) { max-width:100%; min-width:0; }
html.ddqx-appearance[data-ddqx-study="on"] main :is(
  .ddqx-wcd,.ddqx-experience,.ddqx-ahsh,.ddqx-mse-root,
  .ddqx-mcat-practice
) :is(.wp-block-columns,.wp-block-column) { min-width:0; }

/* Mobile does not inherit unnecessary desktop max-width or over-tight gutters. */
@media (max-width:620px) {
  html.ddqx-appearance[data-ddqx-study="on"] body :is(main.ddqx-content-shell,main#wp--skip-link--target) {
    padding-inline:max(16px,env(safe-area-inset-left),env(safe-area-inset-right)) !important;
  }
  html.ddqx-appearance[data-ddqx-study="on"] body.ddqx-reading-page main :is(.wp-block-post-content,.ddqx-post-content) {
    padding:16px !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  html.ddqx-appearance[data-ddqx-study="on"] * { scroll-behavior:auto !important; }
}
@media (forced-colors:active) {
  html.ddqx-appearance[data-ddqx-study="on"] body,
  html.ddqx-appearance[data-ddqx-study="on"] .wp-site-blocks,
  html.ddqx-appearance[data-ddqx-study="on"] .ddqx-site-header {
    background-color:Canvas !important; color:CanvasText !important;
  }
}
/* Printing intentionally ignores Study's layout modifications and controls. */
@media print {
  html.ddqx-appearance[data-ddqx-study="on"] body,
  html.ddqx-appearance[data-ddqx-study="on"] .wp-site-blocks {
    background:#fff !important; color:#000 !important;
  }
  /* Preserve readable printed header text if backgrounds are not printed. */
  html.ddqx-appearance[data-ddqx-study="on"] .ddqx-site-header {
    --da-text:#000; --da-link:#000; background:#fff !important;
    color:#000 !important; box-shadow:none !important;
  }
  html.ddqx-appearance[data-ddqx-study="on"] .ddqx-site-header :is(a,summary,span) {
    color:#000 !important;
  }
  html.ddqx-appearance[data-ddqx-study="on"] .ddqx-site-header .ddqx-appearance-bar {
    display:none !important;
  }
  html.ddqx-appearance[data-ddqx-study="on"] main :is(.wp-block-post-content,.ddqx-post-content) {
    max-width:100% !important; padding:0 !important;
  }
}