/* Text-to-diagram (diagram-maker.php). Loaded after pdf-tools.css, code-tools.css and
   data-tools.css (hero, fields, tab strip, cards); this file adds the teal hero, the editor
   hints, the zoomable canvas and full-screen mode. */
.dg-hero{background:linear-gradient(120deg,#04263a 0%,#0e5a6e 55%,#1f8a8a 150%)}
.dg-hero:before{content:"⇢"}
.dg-hero h1 em{color:#8ff0e0}
.dg-hero .pdft-hero-summary>span,.dg-hero .pdft-hero-badges .icon{color:#8ff0e0}
.dg-hero .pdft-hero-summary i{background:#8ff0e0}
.dg-layout{grid-template-columns:minmax(340px,430px) minmax(0,1fr)}
.dg-controls{display:grid;gap:18px}
.dg-source{min-height:300px;font-size:.86rem!important;line-height:1.6;tab-size:4}
.dg-template{border:1px solid var(--line);border-radius:4px;padding:7px 10px;font-size:.76rem;max-width:180px;background:#fff;color:#183a5a}
.dg-hint{margin:10px 0 0;font-size:.78rem;color:#456276;line-height:1.55}
.dg-hint code{background:#eef3f7;border-radius:2px;padding:1px 5px;font-size:.74rem;color:#0b3155}
.dg-toolbar .dt-icon-btn{width:32px;height:32px}
.dg-toolbar .dt-icon-btn .icon{width:16px;height:16px}
.dg-zoom{min-width:44px;text-align:center;font-size:.76rem;font-weight:700;color:#183a5a}
.dg-shell{position:relative;background:repeating-conic-gradient(#e9eef2 0 25%,#f5f7f9 0 50%) 0 0/24px 24px;border-radius:14px;overflow:auto;min-height:420px;max-height:78vh;box-shadow:inset 0 1px 4px rgba(13,31,49,.12);cursor:grab}
.dg-shell.is-dragging{cursor:grabbing;user-select:none}
.dg-shell:focus{outline:2px solid rgba(47,111,176,.4)}
.dg-canvas{display:inline-block;padding:24px;transform-origin:0 0;min-width:100%;box-sizing:border-box}
.dg-canvas svg{display:block;max-width:none!important;height:auto}
.dg-empty{position:absolute;inset:0;display:grid;place-items:center;color:#8a97a5;font-size:.9rem;pointer-events:none;padding:20px;text-align:center}
.dg-shell.has-svg .dg-empty{display:none}
.dg-shell:fullscreen{max-height:none;border-radius:0;background:#f5f7f9}
.dg-shell.is-error{box-shadow:inset 0 0 0 2px #e5a0a0}
#dg-code{max-height:260px;overflow:auto;user-select:all}
@media(max-width:1000px){.dg-layout{grid-template-columns:1fr}.dg-controls{grid-template-columns:1fr}.dg-source{min-height:220px}.dg-shell{min-height:320px}}

/* ---- dark mode ---- */
[data-theme="dark"] .dg-template{background:var(--dm-surface);border-color:var(--dm-border);color:var(--dm-text)}
[data-theme="dark"] .dg-hint{color:var(--dm-text-muted)}
[data-theme="dark"] .dg-hint code{background:var(--dm-surface-2);color:var(--dm-text)}
[data-theme="dark"] .dg-zoom{color:var(--dm-text)}
[data-theme="dark"] .dg-shell{background:repeating-conic-gradient(var(--dm-bg) 0 25%,var(--dm-surface-2) 0 50%) 0 0/24px 24px}
[data-theme="dark"] .dg-empty{color:var(--dm-text-muted)}