/* ID44 site fixes (Web Design, 2026-09-28). Loaded after theme.css by includes/header.php and includes/ci-chrome.php.
   Bump ?v= in both files when this changes (Cloudflare caches CSS). */

/* 1) Header fits 1240-1439px wide: at 1280 the theme toggle was pushed 24px off-screen (clipped by body overflow-x:hidden). */
@media (min-width:1240px) and (max-width:1439.98px){
  .ci-hdr{gap:12px}
  .ci-nav a,.ci-nav .ci-dd-btn{padding:0 7px}
  .ci-actions{gap:6px}
  .ci-actions .ci-btn{padding:0 12px}
}

/* 2) Standalone pages converted to the full site chrome (body.ci-chrome + includes/ci-chrome.php).
      Their own page CSS used body margins/padding; the site header and footer must stay edge to edge. */
html[data-theme] body.ci-chrome{margin:0!important;padding:0!important;background:var(--ink-900)}
body.ci-chrome .ci-sa{display:block;padding:28px 20px 56px}
body.ci-chrome .ci-footer ul{list-style:none}
body.ci-chrome .ci-footer p{margin:0 0 6px}

/* 3) Long-form document pages (medication dosages): readable width, tables scroll sideways on phones instead of overflowing. */
.ci-doc{max-width:1100px;margin:0 auto}
@media (max-width:760px){
  .ci-doc table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .ci-doc p{text-align:left!important}
}