/* LawyerPara bar on the landing page's showcase Smart Form (fill + thanks pages).
   Deliberately platform-branded and independent of the firm theme. */
.sf-demo-bar {
    --sf-navy: #14192B; --sf-gold: #B08D57; --sf-gold-soft: #E2D0AA;
    display: flex; align-items: center; gap: 14px; flex: 0 0 auto;
    padding: 10px 18px; background: var(--sf-navy); color: rgba(255,255,255,0.86);
    font-family: inherit; font-size: 13px; font-weight: 500; line-height: 1.45;
}
.sf-demo-brand {
    flex: none; color: var(--sf-navy); background: var(--sf-gold-soft); text-decoration: none;
    font-weight: 700; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
    padding: 4px 10px; border-radius: 999px;
}
.sf-demo-brand:focus-visible, .sf-demo-btn:focus-visible, .sf-demo-next-home:focus-visible { outline: 2px solid var(--sf-gold); outline-offset: 2px; }
.sf-demo-text { margin: 0; min-width: 0; }
.sf-demo-text em { color: #fff; font-style: italic; margin-inline-start: 4px; }
.sf-demo-note { display: inline; margin-inline-start: 8px; color: var(--sf-gold-soft); }

html.lf-has-demo-bar body { display: flex; flex-direction: column; }
html.lf-has-demo-bar #root { flex: 1 1 auto; height: auto; min-height: 0; }

@media (max-width: 720px) {
    .sf-demo-bar { align-items: flex-start; padding: 8px 12px; font-size: 12px; }
    .sf-demo-text em, .sf-demo-note { display: block; margin-inline-start: 0; }
}

.sf-demo-next {
    --sf-navy: #14192B; --sf-gold: #B08D57; --sf-gold-soft: #E2D0AA;
    max-width: 560px; margin: 36px auto 0; padding: 24px 26px; text-align: start;
    background: var(--sf-navy); color: rgba(255,255,255,0.82); border-radius: 16px;
}
.sf-demo-next-title { margin: 0 0 6px; color: #fff; font-size: 18px; font-weight: 600; }
.sf-demo-next-body { margin: 0 0 18px; font-size: 15px; line-height: 1.55; }
.sf-demo-next-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.sf-demo-btn {
    display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px;
    border-radius: 999px; border: 1.5px solid rgba(255,255,255,0.3); color: #fff; text-decoration: none; font-weight: 600; font-size: 15px;
}
.sf-demo-btn:hover { border-color: var(--sf-gold-soft); }
.sf-demo-btn-primary { background: var(--sf-gold); border-color: var(--sf-gold); }
.sf-demo-btn-primary:hover { background: #9b7a48; }
.sf-demo-next-home { color: var(--sf-gold-soft); font-size: 13px; }
@media (max-width: 520px) {
    .sf-demo-next { margin: 28px 16px 0; }
    .sf-demo-btn { width: 100%; }
}