/* "Get the code" page for the website widget (/embed). Builds on /site.css. */
.grow{flex:1 1 auto; min-width:0}
.step-h{color:#1a2a27; font-size:18px; margin:4px 0 10px}
.steps > li.off{opacity:.55}
.steps > li.off .opts, .steps > li.off .preview, .steps > li.off textarea, .steps > li.off button{pointer-events:none}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}

.find label{display:block; font-weight:600; margin:0 0 6px}
.find .row{display:flex; flex-wrap:wrap; gap:8px}
.find input{flex:1 1 220px; min-height:48px; padding:10px 14px; font:inherit; font-size:16px; color:#1a2a27;
            border:1px solid #b9b195; border-radius:10px; background:#fff}
.find .muted{margin:8px 0 0}

.results{list-style:none; margin:12px 0 0; padding:0; display:flex; flex-direction:column; gap:8px}
.results button{display:flex; align-items:center; gap:12px; width:100%; min-height:56px; padding:8px 12px; text-align:left;
                font:inherit; font-size:16px; color:#1a2a27; background:#fff; border:1px solid #d8d2bc; border-radius:10px; cursor:pointer}
.results button:hover{background:#f6f2e2}
.results button[aria-pressed="true"]{border:2px solid #00695c; background:#e8f3f1; font-weight:700}
.results img, .results .ph{width:36px; height:36px; border-radius:50%; object-fit:cover; flex:0 0 auto; background:#eee6c8}
.msg{margin:12px 0 0}

.opts{display:grid; gap:12px; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr))}
.opts label{display:flex; flex-direction:column; gap:6px; font-weight:600}
.opts select{min-height:48px; padding:8px 10px; font:inherit; font-size:16px; color:#1a2a27; background:#fff;
             border:1px solid #b9b195; border-radius:10px}
.preview{background:#f3efe2; border:1px dashed #b9b195; border-radius:12px; padding:12px; min-height:120px}
.preview iframe{display:block}

textarea{width:100%; font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; color:#1a2a27;
         padding:10px 12px; border:1px solid #b9b195; border-radius:10px; background:#fff; resize:vertical}
.copied{margin-left:10px; font-weight:600; color:#00695c}
