/* ARI Showcase — public sample (TEMPLATE) packets only. Pairs with sample.js. Never linked by a real packet. */
.banner.sample-ribbon { gap: 12px; color: var(--chrome, #fff); background: rgba(217, 119, 87, .14); border-bottom-color: rgba(217, 119, 87, .35); }
.sample-ribbon .smp-t { overflow: hidden; text-overflow: ellipsis; }
.sample-ribbon .smp-a { flex: none; color: #D97757; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.sample-ribbon .smp-a:hover { filter: brightness(1.15); }
.sample-ribbon .smp-a:focus-visible { outline: 2px solid #D97757; outline-offset: 2px; border-radius: 3px; }
/* the presenter drawer never shows in a sample (sample.js also removes it) */
.notes { display: none !important; }
/* call scene: shown when browser speech is off and a line has no recording */
.cn-tonly { margin: 10px 0 0; }
.cn-tonly[hidden] { display: none; }

/* ?embed=phone: the services hero card shows only the phone and its green call button */
html.embed-phone .r7c-why, html.embed-phone .r7c-more, html.embed-phone .ops-call .scene-side { display: none !important; }
html.embed-phone .ops-call { display: flex !important; align-items: center; justify-content: center; }
html.embed-phone .ops-call .ops-phonewrap { margin: 0 auto; }
/* the language button stands out in samples; its "Languages" label shows where the bar has room (>=1260px, engine rule) */
.rail .rail-lang, .rail-lang { border-color: #D97757 !important; color: #F2C6B4 !important; }
