/* sv-tools.css - demo dialogs (4.7 A-D), the original-photo dialog, demo-form states, copy button. Every page.
   Prefixes: sv-dialog, sv-copy, sv-form. */

.sv-dialog{width:min(520px,calc(100% - 32px));max-height:calc(100svh - 32px);margin:auto;padding:0;border:0;border-radius:var(--sv-r-dialog);background:var(--sv-shell);color:var(--sv-text);box-shadow:var(--sv-shadow-float);overflow:auto;overscroll-behavior:contain}
.sv-dialog::backdrop{background:rgb(15 26 33 / .6)}
.sv-dialog[open]{animation:sv-dlg-in .18s var(--sv-ease)}
@keyframes sv-dlg-in{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.sv-dialog[open]{animation-name:sv-fade}}
.sv-dialog__inner{position:relative;padding:24px 24px 20px}
.sv-dialog .sv-close{position:absolute;top:10px;right:10px}
.sv-dialog__title{margin:4px 96px 14px 0;font-size:clamp(1.3rem,1.1rem + .8vw,1.625rem);font-variation-settings:"opsz" 24;line-height:1.2}
.sv-dialog__title:focus{outline:none}
.sv-dialog__inner > p{margin:0 0 12px}
.sv-dialog__small{font-size:.9375rem;color:var(--sv-muted)}
.sv-dialog__actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:20px}
.sv-dialog__summary{display:grid;grid-template-columns:minmax(0,auto) 1fr;gap:6px 16px;margin:0 0 16px;padding:16px;border-radius:var(--sv-r-img);background:var(--sv-sand);font-size:.9375rem}
.sv-dialog__summary dt{font-weight:600}
.sv-dialog__summary dd{margin:0;font-feature-settings:"tnum"}
.sv-dialog--photo{width:min(720px,calc(100% - 32px))}
.sv-dialog__img{width:100%;height:auto;margin:0 0 16px;border-radius:var(--sv-r-img);background:var(--sv-sand-2)}
@media (max-width:599px){.sv-dialog__actions .sv-btn{width:100%}}

/* demo forms: hidden without JS (base.css), errors are ember text + icon (never colour alone) */
.sv-form .sv-btn[type="submit"]{margin-top:4px}
.sv-form__call{margin-top:16px}

/* copy button (6.9 / 8.4.2): label swaps to "Gekopieerd" + check for 2 s */
.sv-copy.is-done{box-shadow:inset 0 0 0 1.5px var(--sv-lime-deep);color:var(--sv-lime-deep)}
.sv-dark .sv-copy.is-done{box-shadow:inset 0 0 0 1.5px var(--sv-lime);color:var(--sv-lime)}