/* r94 (F1): Read your own certificate, on /tools#read (try-read.js). The same card language as the FDA check beside it
   (fda-check.css): white cards, one hairline, the site's type, and the four state tones. The input sits in the accordion's
   picture column; the review spans both columns below it.

   Every rule is scoped to #tr-tool or #tr-out. The accordion styles its own lists and paragraphs (".d-acc .vs-acc-b>div li"
   adds a blue square and padding, ".vs-acc-b p" sets a 16px paragraph), and those selectors outrank a plain class, so the
   review's cards lost their padding and grew bullets until the rules were scoped. */

/* A tool in the accordion's picture column. The accordion puts every child that is not a picture in the text column, so on a
   wide screen a tool sat on top of the text it belongs beside; both tools on this page take the second column instead. */
@media (min-width:768px){
  .vs-acc-b>.tr-tool,.vs-acc-b>.fc-tool{grid-column:2;grid-row:1;align-self:start}
  .vs-acc-b>.tr-out{grid-column:1/-1;grid-row:2}
}
.vs-acc-b>.tr-out:empty{display:none}

/* the input */
#tr-tool{background:#fff;border:1px solid #e3e6ec;border-radius:16px;padding:24px;display:grid;gap:14px;font:400 15px/22px var(--vs-sans, Inter, system-ui, sans-serif);color:#141821;min-width:0}
#tr-tool p{margin:0}
#tr-tool form{display:grid;gap:14px;min-width:0}
#tr-tool .tr-drop{position:relative;display:grid;gap:4px;justify-items:center;text-align:center;padding:26px 16px;border:1.5px dashed #b9c0cc;border-radius:12px;background:#fafbfc;cursor:pointer;transition:border-color .15s,background .15s;min-width:0}
#tr-tool .tr-drop:hover,#tr-tool .tr-drop.over{border-color:#2554e8;background:#f3f6fe}
#tr-tool .tr-drop.has-file{border-style:solid;border-color:#2554e8}
#tr-tool .tr-drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
#tr-tool .tr-drop:focus-within{outline:2px solid #2554e8;outline-offset:2px}
#tr-tool .tr-drop-ic{width:28px;height:28px;color:#2554e8;margin-bottom:4px}
#tr-tool .tr-drop-t{font:500 15px/22px var(--vs-sans, Inter, system-ui, sans-serif);color:#141821}
#tr-tool .tr-drop-s{font-size:13px;line-height:18px;color:#5b6475}
#tr-tool .tr-drop-f{margin-top:6px;font:500 13px/18px var(--vs-mono, 'Geist Mono', ui-monospace, monospace);color:#2554e8;overflow-wrap:anywhere;max-width:100%}
#tr-tool .tr-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:end}
#tr-tool label:not(.tr-drop){display:grid;gap:6px;font:500 13px/18px var(--vs-sans, Inter, system-ui, sans-serif);color:#3a4150;min-width:0}
#tr-tool label small{font-weight:400;color:#5b6475}
#tr-tool select,#tr-tool input[type="text"]{font:400 15px/22px var(--vs-sans, Inter, system-ui, sans-serif);height:44px;padding:0 12px;border:1px solid #cfd4dd;border-radius:10px;background:#fff;color:#141821;min-width:0;width:100%;box-sizing:border-box}
#tr-tool select:focus-visible,#tr-tool input[type="text"]:focus-visible{outline:2px solid #2554e8;outline-offset:1px;border-color:#2554e8}
#tr-tool button{justify-self:start;font:500 15px/22px var(--vs-sans, Inter, system-ui, sans-serif);padding:10px 18px;border-radius:999px;border:0;background:#141821;color:#fff;cursor:pointer}
#tr-tool button:disabled{opacity:.6;cursor:progress}
#tr-tool button:focus-visible{outline:2px solid #2554e8;outline-offset:2px}
#tr-tool .tr-hint{font-size:13px;line-height:18px;color:#5b6475}

/* the review */
#tr-out{display:grid;gap:16px;font:400 15px/22px var(--vs-sans, Inter, system-ui, sans-serif);color:#141821;min-width:0;margin-top:8px}
#tr-out p,#tr-out h3,#tr-out h4,#tr-out ul,#tr-out ol,#tr-out dl{margin:0}
#tr-out li{position:static;padding:0;font:inherit;color:inherit}
#tr-out li::before{content:none;display:none}
#tr-out [hidden]{display:none}
#tr-out .tr-msg{font-size:14px;line-height:21px;color:#3a4150}
#tr-out .tr-verdict{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 32px;align-items:center;background:#fff;border:1px solid #e3e6ec;border-left:5px solid #9aa3b2;border-radius:16px;padding:22px 24px;min-width:0}
#tr-out .tr-v-verified{border-left-color:#1f8a5b}
#tr-out .tr-v-not_verified{border-left-color:#c2412f}
#tr-out .tr-v-attention{border-left-color:#b7791f}
#tr-out .tr-vtop{display:grid;gap:6px;min-width:0}
#tr-out .tr-kind{font:500 12px/16px var(--vs-mono, 'Geist Mono', ui-monospace, monospace);letter-spacing:.04em;text-transform:uppercase;color:#5b6475;overflow-wrap:anywhere}
#tr-out .tr-head{font:600 26px/32px var(--vs-display, 'Schibsted Grotesk', Inter, sans-serif);letter-spacing:-.015em;color:#141821}
#tr-out .tr-line{font-size:15px;line-height:23px;color:#3a4150}
#tr-out .tr-facts{font-size:13px;line-height:19px;color:#5b6475;overflow-wrap:anywhere}
#tr-out .tr-nums{display:grid;grid-template-columns:repeat(4,minmax(64px,auto));gap:8px}
#tr-out .tr-n{display:grid;gap:2px;padding:10px 12px;border-radius:12px;background:#f5f6f8;text-align:center;min-width:0}
#tr-out .tr-n dt{font-size:12px;line-height:16px;color:#5b6475;white-space:nowrap}
#tr-out .tr-n dd{margin:0;font:600 22px/28px var(--vs-display, 'Schibsted Grotesk', Inter, sans-serif);color:#141821}
#tr-out .tr-n.tr-ok dd{color:#1f8a5b}
#tr-out .tr-n.tr-bad dd{color:#c2412f}
#tr-out .tr-n.tr-warn dd{color:#9a6512}
#tr-out .tr-next{background:#fff;border:1px solid #e3e6ec;border-radius:16px;padding:20px 24px;display:grid;gap:10px}
#tr-out .tr-next h4,#tr-out .tr-sec h4{font:600 17px/24px var(--vs-sans, Inter, system-ui, sans-serif);color:#141821}
#tr-out .tr-next ol{padding-left:22px;display:grid;gap:6px;color:#3a4150;list-style:decimal}
#tr-out .tr-next li{display:list-item;padding-left:2px;font-size:15px;line-height:23px}
#tr-out .tr-sec{display:grid;gap:10px;min-width:0}
#tr-out .tr-count{display:inline-block;min-width:22px;padding:0 7px;margin-left:4px;border-radius:999px;background:#eef0f4;font:500 13px/22px var(--vs-sans, Inter, system-ui, sans-serif);color:#3a4150;text-align:center}
#tr-out .tr-list{list-style:none;padding:0;display:grid;gap:8px}
#tr-out .tr-check{display:grid;grid-template-columns:112px minmax(0,1fr);gap:14px;align-items:start;background:#fff;border:1px solid #e3e6ec;border-radius:12px;padding:14px 16px;min-width:0}
#tr-out .tr-chip{justify-self:start;font:500 12px/16px var(--vs-sans, Inter, system-ui, sans-serif);padding:4px 10px;border-radius:999px;background:#eef0f4;color:#3a4150;white-space:nowrap}
#tr-out .tr-check.tr-ok .tr-chip{background:#e6f4ed;color:#17734b}
#tr-out .tr-check.tr-bad .tr-chip{background:#fbeae7;color:#a3341f}
#tr-out .tr-check.tr-warn .tr-chip{background:#fbf1de;color:#8a5a10}
#tr-out .tr-cbody{display:grid;gap:6px;min-width:0}
#tr-out .tr-cname{font:600 15px/22px var(--vs-sans, Inter, system-ui, sans-serif);color:#141821}
#tr-out .tr-why{font-size:14px;line-height:21px;color:#3a4150;overflow-wrap:anywhere}
#tr-out .tr-fix{display:grid;gap:4px;padding:10px 12px;border-radius:10px;background:#f7f8fa}
#tr-out .tr-fix div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:10px;font-size:13.5px;line-height:20px}
#tr-out .tr-fix dt{font-weight:600;color:#3a4150}
#tr-out .tr-fix dd{margin:0;color:#3a4150;overflow-wrap:anywhere}
#tr-out .tr-math{display:grid;gap:4px}
#tr-out .tr-math code{display:block;font:500 12.5px/18px var(--vs-mono, 'Geist Mono', ui-monospace, monospace);color:#141821;background:#f5f6f8;border-radius:8px;padding:6px 9px;white-space:pre-wrap;overflow-wrap:anywhere}
#tr-out .tr-cite{font:500 12.5px/18px var(--vs-mono, 'Geist Mono', ui-monospace, monospace);color:#2554e8;overflow-wrap:anywhere}
#tr-out .tr-std,#tr-out .tr-group{font-size:12px;line-height:18px;color:#5b6475;overflow-wrap:anywhere}
#tr-out .tr-std a{color:#2554e8}
#tr-out .tr-group:empty{display:none}
#tr-out .tr-na>summary{cursor:pointer;font:500 15px/22px var(--vs-sans, Inter, system-ui, sans-serif);color:#3a4150;padding:4px 0}
#tr-out .tr-na[open]>summary{margin-bottom:8px}
#tr-out .tr-foot{display:grid;gap:12px;padding-top:4px}
#tr-out .tr-boundary{font:600 15px/22px var(--vs-sans, Inter, system-ui, sans-serif);color:#141821}
#tr-out .tr-boundary-s{font-size:13px;line-height:19px;color:#5b6475}
#tr-out .tr-kept{background:#fff;border:1px solid #e3e6ec;border-radius:12px;padding:14px 16px;display:grid;gap:6px;font-size:13.5px;line-height:20px;color:#3a4150}
#tr-out .tr-kept b{color:#141821;font-weight:600}
#tr-out .tr-kept ul{padding-left:18px;display:grid;gap:4px;list-style:disc}
#tr-out .tr-kept li{display:list-item;font-size:13.5px;line-height:20px}
#tr-out .tr-after{background:#141821;color:#f4f4f6;border-radius:16px;padding:22px 24px;display:grid;gap:10px}
#tr-out .tr-after-h{font:600 18px/24px var(--vs-display, 'Schibsted Grotesk', Inter, sans-serif);color:#fff}
#tr-out .tr-after p{font-size:14px;line-height:21px;color:#c9ccd3}
#tr-out .tr-after .tr-after-s{font-size:13px;line-height:19px;color:#a1a1aa}
#tr-out .tr-after .tr-after-ok{color:#8fe0b7;font-weight:500}
#tr-out .tr-after .tr-msg{color:#ffb4a8}
#tr-out .tr-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
#tr-out .tr-btn{display:inline-flex;align-items:center;justify-content:center;font:500 15px/22px var(--vs-sans, Inter, system-ui, sans-serif);padding:10px 18px;border-radius:999px;border:0;background:#fff;color:#141821;text-decoration:none;cursor:pointer}
#tr-out .tr-btn:disabled{opacity:.6;cursor:progress}
#tr-out .tr-btn:focus-visible,#tr-out .tr-link:focus-visible{outline:2px solid #77adff;outline-offset:2px}
#tr-out .tr-link{font:500 14px/22px var(--vs-sans, Inter, system-ui, sans-serif);color:#cfe0ff;text-decoration:underline;text-underline-offset:3px}
#tr-out .tr-save{display:grid;gap:8px;justify-items:start}
#tr-out .tr-save:empty{display:none}

@media (max-width:767px){
  #tr-tool{padding:18px}
  #tr-tool .tr-row{grid-template-columns:1fr}
  #tr-out .tr-verdict{grid-template-columns:1fr;padding:18px}
  #tr-out .tr-nums{grid-template-columns:repeat(2,minmax(0,1fr))}
  #tr-out .tr-check{grid-template-columns:1fr;gap:8px;padding:12px 14px}
  #tr-out .tr-fix div{grid-template-columns:1fr;gap:0}
  #tr-out .tr-next,#tr-out .tr-after{padding:18px}
  #tr-out .tr-head{font-size:22px;line-height:28px}
}

/* r94 (F1, wave 4): the route and dose, the download, and the drafted supplier request */
#tr-tool .tr-dose{border:1px solid #e3e6eb;border-radius:12px;padding:10px 14px}
#tr-tool .tr-dose summary{cursor:pointer;font:500 14px/22px var(--vs-sans, Inter, system-ui, sans-serif);color:#141821}
#tr-tool .tr-dose summary small{font-weight:400;color:#5b6475;margin-left:4px}
#tr-tool .tr-dose[open] summary{margin-bottom:10px}
#tr-tool .tr-row3{grid-template-columns:repeat(3,minmax(0,1fr))}
#tr-tool .tr-dose .tr-hint{margin:10px 0 2px}
#tr-out .tr-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:4px;grid-column:1 / -1}
#tr-out .tr-tools-s{font-size:13px;line-height:18px;color:#5b6475;min-width:0;flex:1 1 220px}
#tr-out .tr-request{display:grid;gap:10px;border:1px solid #e3e6ec;border-radius:16px;padding:20px 24px;background:#fff}
#tr-out .tr-request h4{font:600 17px/24px var(--vs-sans, Inter, system-ui, sans-serif);color:#141821}
#tr-out .tr-rq-subject{font-weight:500;color:#3a4150;overflow-wrap:anywhere}
#tr-out .tr-rq-body{display:block;width:100%;box-sizing:border-box;font:13px/1.5 var(--vs-mono, 'Geist Mono', ui-monospace, monospace);border:1px solid #cfd4dd;border-radius:10px;padding:10px 12px;background:#f8f9fb;color:#141821;resize:vertical}
#tr-out .tr-copy{justify-self:start}
#tr-out .tr-btn.tr-dl{background:#141821;color:#fff}
#tr-out .tr-link.tr-copy{background:none;border:0;padding:0;color:#2554e8;cursor:pointer}
@media (max-width:699px){
  #tr-tool .tr-row3{grid-template-columns:1fr}
  #tr-out .tr-request{padding:18px}
}